push一个元素到数组,结果数组里的其他元素数据全都变成最后push的数据。

代码解释:首先声明一个listx的数组,监听父组件传递过来的 listComplete,存在listComplete就将它push到 listx 数组中。然后将v-for渲染到页面中
在这里插入图片描述
理想中的效果应该是,点击【完成】=> ' 项目2 ' 从未完成列表中删除,并加入到下方已完成列表中。

在这里插入图片描述

但是实际呢?实际上点击加入项目2 后,项目1的内容也变成了项目2
这是因为push的并不是一个值,而是一个地址,数组都指向同一个地址,就好比listx[0]和listx[1]都是指向props.listComplete。每一次push就等同于改变了数组的地址,所以会导致每次都每一元素都变成了最好push的内容。

在这里插入图片描述

解决:每次将要push的数据都存在另外单独开辟的空间中。这样就不会导致,整个数组都是指向一个内存地址。

在这里插入图片描述
或者利用JSON的转换

在这里插入图片描述

现在再试一次呢?完全ok了
在这里插入图片描述

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐