一、问题

项目里新添加了一个多选的功能，其显示的数据都是从后端返回过来的，我们需要在返回来的数据外再额外添加一个是否选中的标记，我的选择是在返回正确的数据时将标记添加进去，然后push到数组中。然后就出现了bug，任意勾选其中一条数据都会导致其他的数据一起被勾选，而且其他显示的内容如果改变了，也会全部改变。原本以为是select选择器写的有问题，就把数据全部改成了测试的固定数据，发现并不会出现问题，才开始怀疑是不是存储内存问题。

错误代码：

 data () {
    return {
 prodCategoryOneShow: {}
    }
}

 

 if (res.data.resCode === AjaxReturnState.success) {
            this.prodCategoryOneShow.prodCategory = res.data.data.prodCategory;
            this.prodCategoryOneShow.prodType = res.data.data.prodType;
            this.prodCategoryOneShow.level = res.data.data.level;
            this.prodCategoryOneShow.period = res.data.data.period;
            this.prodCategoryOneShow.reftRate = res.data.data.reftRate;
            this.prodCategoryOneShow.isChecked = false;
            this.prodCategoryListShow.push(this.prodCategoryOneShow);
          }

 

每一次请求后，我将得到的对象属性的值一条一条塞进prodCategoryOneShow对象里，这样导致的结果是，我每一次请求后塞进的prodCategoryOneShow对象都指向的是同一个内存地址（即第一次在data中申明的prodCategoryListShow的内存），我对数组里的任何一个对象进行操作，都会影响到其他的对象的内容。

修改后的代码：

  if (res.data.resCode === AjaxReturnState.success) {
            this.prodCategoryOneShow = res.data.data;
            this.prodCategoryOneShow.isChecked = false;
            this.prodCategoryListShow.push(this.prodCategoryOneShow);
          }

这样子修改后，每一次请求将data对象简单赋值给prodCategoryOneShow，prodCategoryOneShow的内存地址指向和data保持一致，所以每一次请求后得到的对象地址指向都不同，继而对数组中的对象任意对象操作不会影响到其他对象。

二、其他

对象间的赋值

obj1=JSON.parse(JSON.stringify(obj2));

首先将obj2对象利用JSON.stringify()方法转换成字符串去掉对象属性，再使用JSON.parse()方法转换成对象赋值；

其作用是避免对象直接赋值造成指向相同地址以至于相互影响的问题。

版权声明：本文为songForU原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/songForU/p/11187861.html