兄弟组件传值:中央事件总线

步骤:

第一步:借助中央事件总线:在外部新建一个js文件,取名Bus.js,可放在assets文件夹目录下.
在这里插入图片描述在这里插入图片描述
第二步:两个组件作为子组件被同一个父组件所引用,在同一个页面显示。

在这里插入图片描述在这里插入图片描述
在这里插入图片描述

第三步:两个兄弟组件之间的语法:组件1需要定义一个发送数据的方法,此处sendMsg是定义在此的方法,页面点击时候触发此函数,函数主体,通过Bus中央事件总线用 $emit 发送一个send事件,事件的功能就是传送一个this.a++的数据,区分sendMsg和send,前者是当前页面的点击事件,后者是发送出去,需要其他组件监听的事件。
在这里插入图片描述在这里插入图片描述

第四步:组件2在组件2事先定义一个变量,在生命周期为created的时候,通过Bus中央事件总线用$on监听组件1中发送的send事件,用一个带参数的回调函数,接收穿过来的值,参数即为传的值 ,把值赋值给当前组件的变量。
在这里插入图片描述

发布了28 篇原创文章 · 获赞 1 · 访问量 1423

猜你喜欢

转载自blog.csdn.net/l741938507/article/details/100923532