antd vue 使用tag组件时,调用close会先后关闭2个标签
代码是这样的
<template v-for="(tag, index) in tags">
<a-tag :key="index" :closable="true" @close="() => handleClose(tag)">
{{ tag.classify_name }}
</a-tag>
</template>
// 删除标签
handleClose (tag) {
const tags = this.tags.filter(item => item.id !== tag.id)
this.tags = tags
},
解决办法:tag组件的key不要使用索引,改成类似id这样的字段
使用索引导致删除了2次索引为 i 的值,看起来删除了2个标签
(当然就算使用索引也不应该删2次,是antd vue的锅)
修改后,问题解决
<template v-for="tag in tags">
<a-tag :key="tag.id" :closable="true" @close="() => handleClose(tag)">
{{ tag.classify_name }}
</a-tag>
</template>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。