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父子组件通信方式有哪些? vue父子组件通信】
有关vue父子组件通信方式,大家就介绍到这啦!