我有一个带有 3 个按钮的小 vue 应用程序
<button @click="add(1)">1</button>
<button @click="add(2)">2</button>
<button @click="add(3)">3</button>
将数字添加到数组中
所以通常你可以得到
[1,2,3,1,3]
我将这些输出为列表
<div class="numbers" v-for="(number, index) in numbers">
<span @click="removeNumber(index)">{{ number }}</span>
</div>
但是我的删除号码方法可以做到这一点
removeNumber(index) {
Vue.delete(this.numbers, index ); // I have also used splice here
},
数据(数字)显示了正确的结果,但是 UI 总是删除最后一项而不是我想要的。
所以如果我有
numbers = [1,2,3]
我试图删除数字 2。数据是正确的,但 UI 总是只删除数字 3。
我怀疑这是一个反应性问题,但无法解决。我还尝试将 Vue.delete 包装在 nextTick()