vue组件通信方式

1, props  /   $emit
父组件通过props向子组件传递数据,子组件通过$emit和父组件通信
2,eventBus事件总线($emit / $on
eventBus事件总线适用于父子组件非父子组件等之间的通信
3,(provide / inject)
这种方式就是Vue中的依赖注入,该方法用于父子组件之间的通信。当然这里所说的父子不一定是真正的父子,也可以是祖孙组件,在层数很深的情况下,可以使用这种方法来进行传值。就不用一层一层的传递了。
4,ref / $refs
这种方式也是实现父子组件之间的通信。
5,$parent / $children

使用$parent可以让组件访问父组件的实例(访问的是上一级父组件的属性和方法)
使用$children可以让组件访问子组件的实例,但是,$children并不能保证顺序,并且访问的数据也不是响应式的。
6,$attrs / $listeners
考虑一种场景,A是B组件的父组件,B是C组件的父组件。想要组件A给组件C传递数据,这种隔代的数据,需要用Vue引入了$attrs / $listeners,实现组件之间的跨代通信

你可能感兴趣的:(vue.js,javascript,前端)