我的部件有点古怪。我有一个按钮列表,当单击时,每个按钮都应该通过从数组中删除从dom中删除。在本例中,我使用函数removeItem
并将项的索引传递给它。这很好,并且它正在从数组中移除,但意外的是,同一项正在从另一个数组中移除。
<template>
<button v-for="(item, index) in abc" @click="removeItem(index)">{{ item.name }}</button>
</template
export default {
data: () => ({
abc: [],
xxzz: [],
}),
methods: {
removeItem(index){
this.abc.splice(index, 1);
},
},
created(){
var vm = this;
let formData = new FormData();
axios({
url: '/get/items',
method: 'post',
data: formData
})
.then(function (response) {
if(response.status == 200){
vm.abc = response.data.items;
vm.xxzz = response.data.items;
}
});
}
}
最佳答案
您正在将两个项设置为同一个数组:
vm.abc = response.data.items;
vm.xxzz = response.data.items;
对象的赋值是通过引用完成的。在这种情况下,
abc
和xxzz
都引用同一个底层数组。当您在一个中修改它时,您在另一个中修改它。你可能想make a copy。