Vue动态添加表单项

阅读 73

2022-01-15

效果如图所示:

  • 添加的时候,增加一个成员;
  • 删除的时候,删除对应的成员;其他不变。


list 循环时候,key的值很重要;

如果选取 index 作为key的话,当删除成员的时候,由于index更新,使被删除的input的值仍然存在在对应index的input中。(成员1,2,3;当删除2时,成员2的值会在继续在index为2的位置(即成员3)中出现)

这里是使用 “list.length” - "index" 作为 key,每次成员数量更新的时候,length都是不同,可以保证删除成员时,其他数据不受到影响。

精彩评论(0)

0 0 举报