vue兄弟组件之间的传值

1、建立一个单独的文件bus.js

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

2、传递事件

// 传递事件
import Bus from '你的路径/bus.js'
// 在methods中:
bus() {
  Bus.$emit('eventName', param)
}

3、接收事件

// 接收事件
import Bus from '你的路径/bus.js'
// 在mounted中:
Bus.$on('eventName', (e) => {
  console.log('穿过来的数据' + e)
})

vue、bus 使用遇到的坑,组件之间无法传值;vue、bus 第一次获取不到值,后面数据叠加

问题定位:

  1. 出现无法传值的情况,检查传值过程中组件是否还没有渲染;可能出现的情况是:组件被if,在你使用 Bus.$emit() 时组件还没有渲染出来;
  2. 出现点击重复执行情况,检查bus是否使用后销毁;
    使用Bus.$on后,需要生命周期beforeDestroy中销毁:
beforeDestroy() {
  Bus.$off("onSearchwordKey");
}

 

如果对您有所帮助,点个赞收个藏吧~Thanks♪(・ω・)ノ (✪ω✪) ᕦ(・ㅂ・)ᕤ!!!

Logo

前往低代码交流专区

更多推荐