vue组件通信方式

参考：vue的8种通信方式

1、$emit、props 父子组件通信（常用）

2、 ref、$refs 指向组件实例，可以访问到当前组件的子组件数据和调用子组件方法

3、 eventBus 通过实例一个组件，在需要进行通信的组件里引用该实例，通过$emit和$on实现组件之间的事件监听和发布，（注意事件污染问题， 移除事件监听者：EventBus.$off('addition', {})）

4、 vuex

5、 $attrs、$listeners 子组件可以通过$attrs接收到除 class、style参数和子组件props声明过的参数以外的所有参数，如果孙组件也要获取到父组件的$attrs参数和触发方法，则需要把$attrs和$listeners绑定在孙组件，如： <grand-child v-bind="$attrs" v-on="$listeners"></grand-child>

参考：Vue 新增的$attrs与$listeners的详解

6、 provide / inject 支持跨级通信，不支持实响应式数据更新，使用场景：父组件把methods声明的方法通过provide传递，子（孙）组件调用inject注入该方法，这样就可以调用父辈组件的方法

7、 $parent、$children（不推荐）$children返回当前组件内的所有子组件，如果没有返回空数组；$parent返回当前组件的父组件，如果没有则返回undefined

补充：inheritAttrs 该属性用于解决父组件在调用子组件时，传入非子组件props声明的参数，会造成对html标签的污染 如：<input></input>的type属性

参考：补充一下：inheritAttrs属性