react 表單項動態刪除,刪掉的是最后一個,因為index


項目中有一個動態添加、刪除時間選擇框

每次點擊刪除都會把最后一個刪掉,查了百度都說是key的問題,對比了下,最終的問題在index,把name={`time${index}`},改為name={`time${item.id}`}

所以在遍歷后,不要把index用於元素個項的識別上,例如:key name等

{
                      timeList.map((item, index) => (
                          <FormItem
                          key={item.id}
                            label={index === 0 ? '時間' : ''}
                            {...formItemLayout}
                            wrapperCol={index === 0 ? null : {offset: 3}}
                            required
                            requiredMessage="請選擇時間">
                              <TimePicker
                              name={`time${index}`}
                              defaultValue={item.time}
                              />
                              <Icon type="minus" className="del-icon"  onClick={() => delTimeList(index, item)}/>
                              </FormItem>
                          )
                      )
                    }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM