vue 组件通信的坑当传输的数据为引用类型时,一定要注意,有可能改了子组件的数据,父组件的数据也发生了改变
例子:
如给子组件传输数据: dialogInfo
直接将行数据row(对象)赋值给: dialogInfos(dialogInfo)
在子组件中取值赋值: dialogInfo => ruleForm
但是问题来了!虽然经过了怎么几次赋值!但是 父组件row对象 与 子组件ruleFrom 仍然是一个对象, 他们在底层引用的是一个地址 => 一个对象
问题表现如下:
修改子组件数据:(ruleFrom.share_subtitle)
prop数据也变化了:(dialogInfo.form.share_subtitle)
父组件的行数据也变了:
以上问题的表明虽然 父 子 组件 的不同数据如果引用同一来源的引用数据,
虽然 用的是 不同 的 vue 观察者 , 然而 他们本质 却是 同一个 对象 ,
修改一个会改变其他的, 这会导致错误,正常情况子组件不能这样改变父组件的值!
解决方法:最简单的方法是拷贝新的对象,赋值给子组件,做好隔离!
靳肖健 jxjweb.top
