vue父子组件通信（vue父子组件通信方式有哪些?）

vue父子组件通信方式有什么？我们一起了解一下吧！

vue父子组件通信方式有Prop，$emit、$attrs 、 $listeners、provide 、 inject ，sync语法糖和一些别的方法。下列是常见通信方式的主要详细介绍。

1、prop这一在大家日常开发设计之中使用的特别多。简易而言，我们可以根据 Prop 向子组件传递数据。用一个品牌形象的形容而言，父子组件中间的数据信息传送等同于由上而下的下水管道子，只有从上往下流，不可以倒流。这也恰好是Vue的设计构思之单边数据流分析。而 Prop 恰好是管路与管道中间的一个对接口，那样水（数据信息）才可以往下流。

2、$emit官方网叫法是开启现阶段案例上的事情。额外主要参数都是会发送给监听器调整。

大概逻辑性如下所示：当我还在网页页面上点一下按键时，开启了组件 MyButton 上的窃听事情 greet，而且把主要参数发送给了调用函数 sayHi 。说白了，在我们从子组件 Emit（发放） 一个事情以前，其內部都提早在事件队列中 On（监视）了这一事情以及监视调整。

3、.sync 修饰符在 vue@1.x 的过程中曾做为双重关联作用存有，即子组件可以改动父组件中的值。因为它违背了单边数据流分析的设计构思，因此在 vue@2.0 的情况下被灭掉了。可是在 vue@2.3.0 以上版本号又再次引进了这一 .sync 修饰符。可是此次它仅仅做为一个编译程序时的语法糖存有。它会被拓展为一个自动升级父组件特性的 v-on 监听器。说白了便是使我们手动式开展升级父组件中的值了，进而使数据信息修改来源于更为的显著。

4、$attrs

包括了父作用域中不当作 prop 被鉴别 (且获得) 的特点关联 (class 和 style 以外)。当一个组件沒有申明一切 prop 时，这儿会涵盖全部父作用域的关联 (class 和 style 以外)，而且可以根据 v-bind="$attrs" 传到内部结构组件——在建立高級其他组件时十分有效。

5、$listeners

包括了父作用域中的 (没有 .native 装饰器的) v-on 事情监听器。它可以根据 v-on="$listeners" 传到内部结构组件——在建立更高端的组件时十分有效。

6、EventBus

构思便是申明一个全局性Vue实例变量EventBus，把任何的通讯数据信息，事情监视都储存到这一自变量上，那样就抵达在组件间完成信息共享，有点儿相近Vuex。

有关vue父子组件通信方式，大家就介绍到这啦！

- END -