今天做一個VUE的數(shù)組元素刪除操作,使用的是splice.
然而運行后發(fā)現(xiàn)一直提示"cannot read property 'splice' of undefined".代碼如下:
new Vue({
el:'#app',
data:{
items:[
{name:"test1",val:2},
{name:"test2",val:3},
{name:"test3",val:4},
]
},
methods:{
reduce:function(){
this.items.forEach(function(item,index){
item.val-=1;
if(item.val==0){
this.items.splice(index,1);
}
})
console.log(this.items);
}
},
以上代碼運行后,一直提示"cannot read property 'splice' of undefined",經(jīng)過排查,原來是由于forEach里面的this指向已經(jīng)不是vue實例造成的.
修改代碼如下:
new Vue({
el:'#app',
data:{
items:[
{name:"test1",val:2},
{name:"test2",val:3},
{name:"test3",val:4},
]
},
methods:{
reduce:function(){
var that=this;
that.items.forEach(function(item,index){
item.val-=1;
if(item.val==0){
that.items.splice(index,1);
}
})
console.log(that.items);
}
},
以上代碼運行成功!
