vue数组渲染的问题。

Question

我在用vue熏染table表格的时候遇到一个问题，在原数组中存放数据对象，其中有一个属性a为''，在渲染的时候，这个属性对应的td也是显示为空，我用slice()复制了原数组得到数组tempAry，然后，在数组tempAry中其中的几个对象的这个a属性从''赋值为其他值的时候，在Table表中之前为空的地方会渲染出我赋的值。

所以我就有了疑问，为什么我操作复制后的数组会导致界面的渲染呢? 
var tempAry = this.sortAry.slice();
    tempAry[0].sortTag = '8080';

Answer 1

slice只是第一层拷贝，对于第二层而言还是浅拷贝，请用JSON.parse(JSON.stringify(this.sortAry))

            var tempAry = JSON.parse(JSON.stringify(this.sortAry));
            tempAry[0].sortTag = '8080';
    

Answer 2

深拷贝和浅拷贝的问题吧

Answer 3

你把这个复制之后数组打印出来看看，里面每个元素里面的属性都还是被劫持了get set方法。所以你修改了tempArr还是会导致之前的视图被重新渲染。如果你想把vm.data无副作用地赋值给某一个变量，可以直接使用JSON.stringify(vm.data)