请教老铁们， vue 的 props 传递复杂的对象和数组嵌套的时候如何保证不修改父组件的数据呢

This topic created in 3044 days ago, the information mentioned may be changed or developed.

我之前都是递归复制一个新的多个数组的嵌套或者对象的嵌套。。其他人是怎么做的呢

嵌套

老铁

props

Vue

5 replies • 2018-01-16 10:14:39 +08:00

ghostgril

Jan 15, 2018

在 props 中传递的是对象或是数组，根据 JavaScript 的特性，传递过来的是引用类型，所以我在子组件中也是能够修改父组件的数据的。
为了避免干扰父组件数据，难道每次都将 props 数据转换成深拷贝的局部变量或计算属性吗？
如何优雅的方式解决这种双向数据？
为什么 props 传递过来的数据不使用深拷贝？

noe132

Jan 15, 2018

理论上传过来的数据不应该做修改。
既然要做修改，最简单就是深拷贝。
JSON.parse(JSON.stringify(obj))
或者需要修改的部分手动拷贝

默认深拷贝会有性能上的影响，并且不是每一种情况下都需要这样处理。

exonuclease

Jan 15, 2018 via Android

immutable.js 拯救你要不就干脆上 vuex

ghostgril

Jan 16, 2018

@exonuclease 这是在页面里创建一个新数据遇到的问题，提交保存之前都不是传到 vuex，那么只有使用 immutable.js 了吧？这是 react 的插件？

exonuclease

Jan 16, 2018 via Android

@ghostgril 这个库不绑定框架的啊都可以用
哦对 vuex 搞不定这个鬼问题