Vue组件通信

1. 父子通信

1.1 props和emit

父 -> 子 props
子 -> 父 事件$emit

1.2 双向绑定

v-model   　　　　子组件用$emit('input',data)，可以用model属性修改value和input的名字。

.sync       　　　　在vue2.2恢复使用，可以实现双向修改，本质还是props和事件emit，vue内部进行了封装

props传递对象      props向下传递一个对象，子组件修改对象的属性，父组件的对象会发生变化

1.3 $parent和$children组件引用

在父子组件联系紧密的时候使用，相关度低的组件不要使用。

$parent                父组件的引用

$children             子组件的引用，数组，遍历操作

1.4 $attrs和$listeners

此方法尤其适用于爷孙组件，inheritAttrs: false可以控制中间组件不将多余props显示为html attribute，$attrs和$listeners可以将props和事件向下传递，孙组件和爷组件可以通信。

$attrs和$listeners用法示例

1.5 provide和inject

2. 通信方案

1. Event bus

使用一个Vue实例，或者任意一个PubSub的库作为中心，进行消息通信。
例如：

Vue.prototype.bus = new Vue

this.bus.$on 订阅事件
this.bus.$emit 触发事件

2. Vuex

通用的组件传值方案