vue对data中的数组操作时出现错误渲染的情况

vue当中对于数组元素不仅要用push、splice等方法进行修改，而且修改前后，对象的属性必须完全一致（不能少了一个属性或者多了一个属性）否则很容易会导致数据错误的渲染，我踩的坑就是在使用element的table组件时出现的。这个坑是不会报错的，而且这个问题还是偶发性的，不一定每次都能复现，当时这个坑卡住了我一个下午，所以现在有空就记录一下。

问题具体表现：

注意：我使用的是element的table组件
1、读取数据时，选取的数据和实际行内数据不一致
2、修改数据时，明明修改的是A行数据，但是却把B行的数据也一并改了

问题原因：

很抱歉，我也没找到。我当时百度了一个下午也没找到原因，最后是通过其他能正常操作、渲染的table组件才一步步试错出来的，该错误渲染的情况不知道是elementUI的组件问题还是vue本身是这么限定的。但以后进行数组操作的时候，还是遵守数组内的对象的属性完全一致这个规范比较好。

解决方案：

//源数据：
let data = {
    id:1,
    data2:2,
    data3:3,
    data4:4,
    data5:{
        id:1,
        data5_1:'aaa'
    }
}

//错误示范：
let wrong1 = {
    id:1,
    data2:2,
    data3:3,
    data4:4,
    data6:10//这里多了data6属性
    data5:{
        id:1,
        data5_1:'aaa'
    }
}

let wrong2 = {
     id:1,
    data2:2,
    //data3:3,//这里少了data3属性
    data4:4,
    data5:{
        id:1,
        data5_1:'aaa'
    }
}

let wrong3 = {
    id:1,
    data2:2,
    data3:3,
    data4:4,
    data5:{
        id:1,
        data5_1:'aaa',
        data5_2:'bbb'//这里多了data5_2属性
    }
}

//正确示范：
//除了值不一样以外，所有属性与对象里面的属性都必须和源数据一样,
//不能多、不能少、不能改属性名。
let data = {
    id:1,
    data2:88,
    data3:6,
    data4:12,
    data5:{
        id:1,
        data5_1:'zzz'
    }
}