当我们需要对后台获取的res.data进行新绑定数据的时候
如:
data () {
return {
list: [ ]
}
}
.....................res => {
this.list = res.data;
this.list.forEach(item => {
item.a = 1234;
})
}
这个时候,如果对上面新添加的变量a进行值更新操作并不能触发视图更新,如:
如上面的批量打折并不能影响下面打折,即使对list => item.a = 789 ,但是视图里a的值
还是1234
解决办法就是先声明一个list,将变量绑定后再给this.list赋值
.....................res => {
var list = [ ];
list = res.data;
list.forEach(item => {
item.a = 1234;
})
this.list = list
}
还可以用vue里面的Vue.set( target, key, value )来添加对象属性或者来改变数组,只能改变根属性data下面的子元素
data() {
return{
arr: [1,2,3],
obj: {
a:1,
b:2,
}
}
}
vue.set(vm.arr,1, 'hwl') ====> arr:[1,'hwl',3]
vue.set(vm.obj, 'c', 3) ===⇒ obj: {
a:1,
b:2,
c:3
}