1,bus总线传值

2,常规子1传父->父传子2

3,vuex

这里详细说明bus总线传值的总路线及方法:本例为基本用法,如果不理解的可以看下面的详细使用方法:

//bus.js 
import Vue from 'vue';
export default new Vue;
//使用 兄弟A 传值
import bus from '路径'
bus.$emit('自定义事件名称',输出数据)
//使用 兄弟B 接值
import bus from '路径'
bus.on('自定义事件名',(res)=>{})

一. bus总线传值的使用:

1,在项目中创建一个单独的eventBus.js文件

2,该js文件的内容很简单,就是暴露一个vue实例而已。

有人喜欢在main.js全局引入该js文件,我一般在需要使用到组件中引入。

 3,创建相关组件:

4,父组件中注册并使用子组件:

5,分别在子组件one和two中引入eventBus.js 

6,one组件向two组件传值:(传值使用$emit)

7,two组件接收到one组件的值:(接收值使用$on)

 

到这里其实使用bus总线实现兄弟组件之间的传值已经完成。

 

 

 

 

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐