脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-Vuejs组件――父子组件通信解析，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。
①访问子组件、父组件、根组件;
this.$parent 访问父组件
this.$children 访问子组件(是一个数组)
this.$root 根实例的后代访问根实例
示例代码：
父组件：
子组件：
当在子组件的输入框按键弹起时，显示内容依次为：
父组件、父组件的输入框的值(默认情况是1)、0(表示是父组件的children属性中的第一个元素)、true(由于父组件就是根组件，所以是全等的);
通过这样的方法，可以在组件树中进行互动。
②自定义事件：
首先，事件需要放置在events属性之中，而不是放置在methods属性中(新手很容易犯的错误)，只能触发events属性中的事件，而methods属性中的事件是无法触发的。
事件说明
$on(事件名)事件名的类型是字符串(下同)，调用它可以通过this.$on()来调用;
$emIT(事件名, 参数)用于触发事件，参数是用于传递给事件的参数。这个用于触发同级事件(当前组件的)
$dispatch(事件名, 参数)①向上派发事件，用于向父组件传播。
②会首先触发当前组件的同名事件(如果有);
③然后会向上冒泡，当遇到第一个符合的父组件的事件后触发并停止;
④当父组件的事件的返回值设为true会继续冒泡去找下一个。
$broadcast(事件名, 参数)①向下广播事件，用于向所有子组件传播。
②默认情况是仅限子组件;
③子组件事件的返回值是true，才会继续向该子组件的孙组件派发;
④不会触发自身同名事件;
其次，向上派发和向下广播有所区别：向上派发会触发自身同名事件，而向下广播不会;
第三，向上派发和向下广播默认只会触发直系(子或者父，不包括祖先和孙)的事件，除非事件返回值为true，才会继续在这一条线上继续。
第四，事件不能显式的通过 this.事件名 来调用它。
示例代码：
父组件：点击向下传播broadcast
子组件1：
另一个子组件1：
}, parentClick: function () { console.LOG("parentClick-anotherChildren2"); } } } } } } });
说明：
【1】点击父组件的按钮，会向下广播，然后触发子组件1本身，另外一个子组件1，以及另一个子组件2;
【2】点击子组件2的按钮，会触发子组件2的事件和子组件1的事件，但不会触发父组件的按钮;
【3】点击另一个子组件2的按钮，会触发另一个子组件2的事件，另一个子组件1的事件和父组件的事件(因为另一个子组件1的事件的返回值为true);
③使用v-on绑定自定义事件：
【1】简单来说，子组件触发某个事件(events里的方法)时，父组件也会执行某个方法(父组件methods里的方法)。
【2】触发的绑定写在模板之中(即被替换的那个template模板中)，可以多个子组件的事件绑定一个父组件的方法，或者不同子组件的事情绑定不同父组件的方法，但是不能同一个子组件事件绑定多个父组件的方法。
【3】子组件派发消息传递的参数，即使子组件的事件没有参数，也不影响将参数传递给父组件的方法(即父组件的方法可以接受到子组件方法获取的参数)
如示例：
父组件：点击向下传播broadcast
子组件1：
④子组件索引
简单来说：就是可以直接从索引获取到子组件，然后就可以调用各个子组件的方法了。
添加索引方法是：在标签里添加v-ref:索引名
调用组件方法是：vm.$ref.索引名
也可以直接在父组件中使用this.$ref.索引名
这个时候，就可以获得组件了，然后通过组件可以调用他的方法，或者是使用其数据。
示例代码：
父组件：触发子组件的事件
觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！
以上是脚本宝典为你收集整理的javascript代码实例教程-Vuejs组件――父子组件通信解析全部内容，希望文章能够帮你解决javascript代码实例教程-Vuejs组件――父子组件通信解析所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。