vue中eventBus的实现原理

时间：2020-12-30 11:21:35 阅读：51 评论：0 收藏：0 [点我收藏+]

1.概念
EventBus是消息传递的一种方式，基于一个消息中心，订阅和发布消息的模式，称为发布订阅者模式。

2.实现

技术分享图片

3.使用

注：只不过在vue中已经替我们实现好了$emit,$on这些方法，所以直接用的时候去 new Vue()就可以了.

4.实例

定义event-bus.js文件

import Vue from ‘vue‘

const eventBus= new Vue()

export default eventBus

使用页面：

import eventBus from ‘@/system/lib/event-bus‘ //引入event-bus.js文件

//创建的时候调用 getList这个自定义方法

created() {

eventBus.$on(‘getlist‘, this.getErTongYFJZJLList) // 监听接收消息

//组件销毁时移除监听事件

beforeDestroy(){

eventBus.$off(‘getlist‘) //移除监听事件

// 发送消息

eventBus.$emit(‘getlist‘, this.jianKangDAID)

调用父页面方法：this.$parent.pageInit()

父页面给子页面传值：

技术分享图片

原文：https://www.cnblogs.com/hyh521/p/14210133.html

踩

(0)

评论一句话评论（0）

分享档案

更多>