zoukankan      html  css  js  c++  java
  • 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>
                              )
                          )
                        }
  • 相关阅读:
    引用的难点:函数返回值是引用(引用当左值)
    引用的意义与本质
    引用做函数参数
    Uva
    Uva
    Uva
    暑假集训-8.06总结
    暑假集训-8.05总结
    CH1801( 括号画家)
    最大异或对
  • 原文地址:https://www.cnblogs.com/zhuangcui/p/12714714.html
Copyright © 2011-2022 走看看