本篇文章是小编结合官方文档整理的一套更加细致，代码更多更全的教程，非常不错，比较适合新手阅读。
本篇资料来于官方文档：
http://cn.vuejs.org/guide/components.html#u7236_u5B50_u7EC4_u4EF6_u901A_u4FE1
父子组件通信
①访问子组件、父组件、根组件；
this.$parent 访问父组件
this.$children 访问子组件（是一个数组）
this.$root 根实例的后代访问根实例
示例代码：
<div id="app">
父组件：
<input v-model="val"><br/>
子组件：
<test :test="val"></test>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
val: 1
},
components: {
test: {
props: ['test'],
template: "<input @keyup='findParent' v-model='test'/>",
methods: {
findParent: function () {
console.log(this.$parent); //访问根组件
console.log(this.$parent.val); //访问根组件的val属性
console.log(this.$parent.$children.indexOf(this)); //查看当前能否在其父组件的子组件中找到索引
console.log(this.$parent === this.$root); //查看父组件和根组件是不是全等的（因为他的父组件就是根组件）
}
}
}
}
});
</script>当在子组件的输入框按键弹起时，显示内容依次为：
父组件、父组件的输入框的值（默认情况是1）、0（表示是父组件的children属性中的第一个元素）、true（由于父组件就是根组件，所以是全等的）；
通过这样的方法，可以在组件树中进行互动。
②自定义事件：
首先，事件需要放置在events属性之中，而不是放置在methods属性中（新手很容易犯的错误），只能触发events属性中的事件，而methods属性中的事件是无法触发的。
其次，向上派发和向下广播有所区别：向上派发会触发自身同名事件，而向下广播不会；
第三，向上派发和向下广播默认只会触发直系（子或者父，不包括祖先和孙）的事件，除非事件返回值为true，才会继续在这一条线上继续。
第四，事件不能显式的通过 this.事件名 来调用它。
示例代码：
<div id="app">
父组件：
<button @click="parentClick">点击向下传播broadcast</button>
<br/>
子组件1：
<children1></children1>
<br/>
另一个子组件1：
<another-children1></another-children1>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
val: 1
},
methods: {
parentClick: function () {
this.$broadcast("parentClick", "abc");
}
},
events: {
childrenClick: function () {
