1. 创建一个vue实例,且在main.js文件里全局引用
import Vue from 'vue'
const bus = new Vue()
export default bus
2.main.js
import bus from '@/utiles/bus.js'
3.发射事件[A组件]
setTimeout(() => {
//row 代表要传递的参数数据
this.$bus.$emit("yulan", row);
}, 100);
4.监听事件【B组件】
mounted(){
this.$bus.$on("yulan", (res) => {
console.log('ss',res);
request({
url: "/preview/previewEmployeeInfo",
method: "get",
params: {
employeeId:res.eid,
},
}).then((res) => {
this.url = res.data.data;
});
});
}
5.解决第一次监听不到数据有两种方法
第一 : this.$nextTick实现
this.$nextTick(function () { //解决第一次监听不到数据
this.$bus.$emit("yulan", row);
})
第二 : setTimeout定时器来实现
setTimeout(() => {
//row 代表要传递的参数数据
this.$bus.$emit("yulan", row);
}, 100);