前言
在通过点击一个列表进行数据的删除的时候，会发现一个问题，就是删除一个集合的数据会同时删除另一个集合的数据，起初发现的时候，以为我逻辑写的有问题，然后没发现出问题。然后进行查找，发现
出现此问题的原因就是两个数组来源于同一个对象的指针引用，
所以在对其中一个数组进行操作的时候，才会影响到另一个同源的数组
同样，对于修改操作也进行一个记录
集合数据
<script>
export default {
name: "app",
data() {
return {
listA: ["A数据","B数据","C数据"], // 集合A，原始数据
listB: [], // 集合B，所有数据来源于集合A
listC: [], // 集合C，所有数据来源于集合A
}
}
}
</script>
问题分析
在对我的代码进行分析的时候，发现我进行点击单个v-for列表的数据从listA添加到listB的时候，在进行删除listB数据操作的时候并不会受到影响。
而通过全选把listA的数据赋值给listB，在删除listB的数据的时候会导致连同listA的数据一起删除。
通过查看代码发现，通过全选进行赋值的操作为:
<script>
export default {
name: "app",
methods: {
// 赋值list方法
setListData() {
this.listB = this.listA
}
}
}
</script>
删除会同步删除另一个数据解决办法
个人使用的解决办法有两种
方法一
<script>
export default {
name: "app",
methods: {
// 赋值list方法
setListData() {
this.listB = [...this.listA]
}
}
}
</script>
方法二
<script>
export default {
name: "app",
methods: {
// 赋值list方法
setListData() {
for (let i in this.listA) {
this.listB.push(this.listA[i]);
}
}
}
}
</script>
修改会同步修改另一个数据解决办法
<script>
export default {
name: "app",
methods: {
// 赋值list方法
setListData() {
this.listB=this.listA;
this.listC=json.parse(json.stringify(this.listA))
}
}
}
</script>
结语
以上为本人解决修改一个集合数据会同时修改另一个集合数据问题的过程.
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/136683.html
