vue 页面传值_哇操，vue-bus

前言.父子组件之间的通信vue提供了更直接的方式，此处不细说，不会的可以去官网研读文档。但是官方没有提供直接的方法用于兄弟组件之间的传值以及相关的逻辑处理。因此就有了vue-bus和vuex.vue-bus可用于不是特别复杂的项目中任意组件的传值问题。vuex不仅能实现组件之间通信的问题还提供了相应的逻辑处理方法。但是也更为庞大，所以一般简单的传值问题可用于vue-bus解决

1.vue-bu官网地址

vue-bus

第一步：安装

第二部：

单页面之中main.js文件中注册

第三步：使用

在想传递出去的页组件中某个方法里面触发事件

下面图片中触发了一个叫做add-todo的事件，并传递了一直值{ text: this.newTodoText }，还触发了一个叫做once的事件

然后在想接受=收传递过来数据的页面监听触发的事件

下面图片中this.bus.on监听add−todo事件并接受传递过来的值，并传入了一个回调函数addTodo,这个函数的参数就是传递过来的数据（newTodo）,this.bus.on监听add-todo事件并接受传递过来的值，并传入了一个回调函数addTodo,这个函数的参数就是传递过来的数据（newTodo）,this.bus.on监听add−todo事件并接受传递过来的值，并传入了一个回调函数addTodo,这个函数的参数就是传递过来的数据（newTodo）,this.bus.once是只监听一次之后就不在监听。

注意：监听事件要尽早监听越好，所以一般放在created这个周期函数里面。

其次就是离开这个页面之后就没有必要再监听，所以要销毁这个监听事件，this.$bus.off销毁监听事件。

on once off emit 是 $on $once $off $emit的别名。

————————————————

版权声明：本文为CSDN博主「小白菜地里黄」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。

原文链接：

CSDN-专业IT技术社区-登录​blog.csdn.net