vue 子组件数据更新如何让父组件数据同步更新

265 阅读1分钟

方案一

子组件中接受的数据

image.png

对该数据进行处理之后将其赋值在子组件自己的data数据中

image.png

在父组件中使用.sync修饰符来接受子组件中需要更新的数据

image.png

最后在子组件中使用 emit 告诉父组件更新的数据

image.png

方案二

直接在子组件中使用侦听器实现

image.png

总结

以上两种方案的区别在于 子组件中接收到 valueJson 值时,是否需要对该值进行处理之后使用;

例如:我在实际开发过程当中(bug修复时),对valueJson进行了进一步处理,filesList与valueJson的值并不相同,这两个数据在我的操作过程中不处于同一个数据链接,所以并不能像方案二中那样直接实现同步更新。