组件通讯的关系： 父子组件通讯，兄弟组件通讯，跨级组件通讯。
父子组件通讯 <!--
当子组件像父组件传递数据时，就要用到自定义事件了。
Vue组件通讯模式
观察者模式 dispatchEvent和addEventListener
子组件用$emit() 来触发事件
this.$emit("addNum", this.count);
父组件用$on() 来监听子组件的事件
<brother
// v-model还可以创建自定义表单输入组件，进行数据绑定
v-model="modelNum" // 子组件事件 this.$emit("input", this.modelNum);
@addNum="emitEventAdd" //触发自定义事件
@click.native="clickComponent" // 原生事件
></brother>
父组件也可以直接在子组件的自定义标签上使用v-on
来监听子组件触发的自定义事件
v-on 除了监听DOM事件，也可以用.native监听DOM原生事件.监听的是该组件的根元素
v-model
this.$emit('input', number);
-->
Bus /中央事件总线bus 、父链和子组件索引
/**
* 创建一个空的vue实例
* bus能够轻量巧妙的实现 父子 兄弟 跨级组件的通讯。
* 如果深入使用。也可以添加data,methods,computed等选项，这些都是公开的。
* 在遇到一些需要共享信息的时候，只需要在初始化Bus时获取一次，
* 任何事件，任何组件就可以使用了
*
* 如果项目比较大，可以选择更好的解决方案Vuex
*
* 除了中央事件总线Bus，还有两种方式能够实现组件通讯：
* 父链 和 子组件索引 递归向上或向下无限访问
* this.$parent 访问父组件。
* this.$children 访问子组件
*
* $refs只在组件渲染完成后才填充。并且是非响应式的。
* 它仅仅是作为直接方位子组件的应急方案。
*/
Bus
触发： Bus.$emit("sendMessage", this.message);
响应： Bus.$on("sendMessage", val => {
this.message = val + "-" + Bus.busMessage;
});
父链
this.$parent 可以直接访问父组件的实例或者组件
this.$parent.h3Message = "from one";
子组件索引
通过this.$children来遍历找到子组件比较困难，通过ref指定一个索引名称
<two ref="two"></two>
this.$refs.two.parentMessage = "from index";