一文讲清vue中自定义事件监听和分发

最新推荐文章于 2024-08-30 19:58:42 发布

Zdde_

最新推荐文章于 2024-08-30 19:58:42 发布

阅读量894

点赞数

分类专栏： JavaScript 前端文章标签： javascript vue.js es6 前端

本文链接：https://blog.csdn.net/weixin_43213137/article/details/113837206

版权

本文详细介绍了在Vue中如何实现自定义全局事件总线，包括事件监听、分发和移除。通过分析Vue组件实例与原型链的关系，解释了为什么普通on和emit无法实现兄弟组件间通信，以及如何利用eventBus实现这一目标。同时提出了在main.js中直接扩展Vue原型的方法，简化事件总线的创建和使用。

摘要由CSDN通过智能技术生成

自定义全局事件总线

事件监听和组件传值方式

在Vue中我们可以使用下面的代码来实现组件中自定义事件的监听和分发：

//在父组件中
mounted () {
   
	//给Header组件添加addTodo事件，通过$on监听
	 this.$on('addTodo', this.addTodo)
}
methods: {
   
      addTodo (todo) {
   
        this.todos.unshift(todo)
      },
}

//Header组件中
methods: {
   
      add