VUE中怎么实现兄弟组件传值操作

VUE中怎么实现兄弟组件传值操作,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

创新互联专注于企业营销型网站、网站重做改版、大城网站定制设计、自适应品牌网站建设、H5响应式网站商城网站定制开发、集团公司官网建设、成都外贸网站制作、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为大城等各大城市提供网站开发制作服务。

1、兄弟之间传递数据需要借助于事件车,通过事件车的方式传递数据

2、创建一个Vue的实例,让各个兄弟共用同一个事件机制。

3、传递数据方,通过一个事件触发bus.$emit(方法名,传递的数据)。

4、接收数据方,通过mounted(){}触发bus.$on(方法名,function(接收数据的参数){用该组件的数据接收传递过来的数据}),此时函数中的this已经发生了改变,可以使用箭头函数。

我们可以创建一个单独的js文件eventVue.js,内容如下

import Vue from 'vue';
export default new Vue();

假如父组件如下:

子组件a如下:


子组件b如下:


看完上述内容,你们掌握VUE中怎么实现兄弟组件传值操作的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!


网站标题:VUE中怎么实现兄弟组件传值操作
链接URL:http://myzitong.com/article/gcdcjh.html