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>