vue 父组件通过 props 传值给子组件，如何初始化子组件呢

[ghostgril]

我通过 props 传递数据给子组件初始化数据，但是因为子组件包含输入框等修改父组件传过来的内容，所以为了不直接修改父组件传递的 props，我需要对数据进行深克隆处理，那么我这个处理应该放在哪里呢？放在 monuted,beforeMonut 之类的生命周期，在父组件修改数据的时候不会重新执行。

我的思路就是给子组件绑定一个 key 值，key 值就是传递的 props 的 json.stringify 处理后的字符串，那么数据一改就会重新渲染。不知道这种方法是否是合适的方法？

一般大家是怎么处理的呢

[ghostgril]

直接通过 props 传递数据是否是一种好的方式呢，还是通过 props 传递 uuid 再到 vuex 里面去获取响应的数据呢？

[VDimos]

子组件对 props 的修改不会反应到父组件，在子组件里修改 prop 会触发警告。解决方案是定义局部 data，把 prop 用来初始化

[ghostgril]

@VDimos 对啊，就是这个初始化在哪进行的问题。

[VDimos]

@ghostgril 把 props 的值给 data 不就行了？

props: ['initialCounter'],
data: function () {
return { counter: this.initialCounter }
}

[ghostgril]

@VDimos 如果是普通的值是可以的，但是如果传过来是对象呢就必须执行初始化

[ghostgril]

@VDimos 应该说是必须进行深克隆，否则修改会修改里面的内容

[heww]

@ghostgril #6 是的，用 clone，我们一般用 lodash 的 clone 来处理。

[VDimos]

@ghostgril 我一般只传递扁平化的对象，两层及以上。所以一般直接用 Object.assign 或者赋值解析就行了。如果超过两层的复杂对象，不推荐使用 props 来传递，用状态管理工具更好

[VDimos]

@ghostgril 说错了，两层及两层以上不用 props 传递

[yilin12]

用 computed 处理父组件传递进来的 props