前端vue使用bus通讯操作方法

丫个丫个丫

2021-09-06 1,100 阅读1分钟

第一步：建立bus文件组件通信

在文件夹下面写一个bus.js的文件写入以下代码

// bus.js
import Vue from 'vue' 
export default new Vue()

第二步：建立bus文件发送

// 引入公共的bus 
import Bus from '../../api/bus' 
// 生命周期函数
created(){
    Bus.$emit('val', 要传递的值)
    console.log('我发送成功了');
 },

第三步：建立bus文件接收

import Bus from '../../api/bus'
created(){ 
     // 用$on事件来接收参数
     Bus.$on('val', (data) => {
     console.log(data) 
  })
 }