javascript - 请问vue中props传过来的值a,赋值给data中的值b,b变化,a也跟着变化,怎样避免props传过来的值不变化?

查看:168
本文介绍了javascript - 请问vue中props传过来的值a,赋值给data中的值b,b变化,a也跟着变化,怎样避免props传过来的值不变化?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

代码如下
//member代表b值
data() {

return {
    members: this.propMembers || [],
}

},
//propMembers代表a值
props: ['propMembers'],

members修改了,props中的propMembers也会跟着改变,这两个值都是数组,貌似是数组引用的是地址问题。但是我想一直保留刚开始传过来的propMembers值该怎么做?

解决方案

很简单, 既然你都知道数组和对象是应用传递, 父组件给子组件赋值的时候, 传递members的深拷贝对象就可以了, 具体点就是创建个临时对象, 传递给子组件, 伪代码

let _members = Object.assign([], members)
//或者 let _members = members.slice()

Object.assign不适用于多层嵌套对象, MDN描述文档
这样做, 子组件props和父组件的变量不是一个引用了

这篇关于javascript - 请问vue中props传过来的值a,赋值给data中的值b,b变化,a也跟着变化,怎样避免props传过来的值不变化?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆