VUE使用事件总线EventBus时出现{__ob__:Observer}无法取值与渲染

需要完成的功能：组件A与组件B并不是同一界面，通过路由跳转，将一个对象stem从组件A传递到组件B。

出现该问题现象的可能性有多种可能性，这只是引发该类问题的其中因素之一；

由于解决本次问题的方式比较简单，故此随笔也比较水，仅为BUG记录。

事故简介：

可以使用console.log()在浏览器控制台可打印值，但是无法给定义在data中的字段赋值，更不能在页面渲染

事故现场：

1. 组件A：

methods:{
submitForm(){
bus.$emit("stemList", stem)
}
}


2. eventBus.js

import Vue from "vue";
export default new Vue()


3. 组件B：

export default {
data () {
return {
questions:{}
}
},
created() {
bus.$on("stemList",val =>{
this.questiothis = val
console.log(val)
})
},
}


4. 浏览器控制台打印的结果：

这里进行了两次重复操作，第一次路由跳转后控制台并没有输出内容，第二次跳转才打印如下内容，可见在第二次跳转后已经拿到值了，但是界面使用了{{ }}插值表达式并没有渲染出任何东西。

注意一句话：（第一次路由跳转后控制台并没有输出内容，第二次跳转才打印如下内容）

问题可能性分析：

由于进行了两次重复路由跳转操作，第一次无响应，第二次才打印数据，由此推断出可能是因为$emit发送数据时，$on还来不及创建，所以无法接收。

问题解决：

//这里加setTimeout延迟一下，使.$on的创建早于.$emit
setTimeout(()=>{
bus.$emit("stemList",res.data)
})


虽然控制台还是打印{ _ob__: Observer}但是已经可以进行赋值与渲染了