Vue中三种更新父组件数据的方式,有什么有优缺点,用哪种最好

我目前知道的三种更新父组件数据的方式:

  1. 直接使用$parent修改

  2. 使用.sync,子组件触发更新

  3. 父组件提供一个更新函数,子组件触发更新

我想知道除了这几种,还有其他方式吗?哪种方式更好

阅读 3.5k
2 个回答

一般是用$emit触发事件来更新父组件的事件
使用sync的话也要emit一个update事件来更新。

直接使用$parent来更新数据是最应该避免的,这样会让你的子组件和父组件耦合,子组件不能单独使用,同时也会让你debug变得困难

补充一下:
你列出来三种方式,其实第二种和第三种是一样的

sync也是一个语法糖,和v-model很像。都是传值的同时加了一个事件监听

<comp :foo.sync="bar"></comp>
// 等价于
<comp :foo="bar" @update:foo="val => bar = val"></comp>

.sync在vue2已经不用了,一般用vuex比较方便,简单的用$emit也能实现

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题