百度了一些办法,用$emit暂存,到返回后的页面去接收,一直得不到数据。方法如下:
1. 声明一个空的Vue模块eventBus
import Vue from 'vue'
/** * 定义空的vue实例,作为 eventbus实现非父子组件之间的通信(vue2.x中去掉了broadcast) */ var eventBus = new Vue({}); export default eventBus;
2.通过eventBus.$emit
传参给上一个页面
import eventBus from '../service/eventbus.js'; methods:{ //列表选中具体医院的点击事件 goback(hospital){ //传递一个map,choiceHospital是key,hospital是value eventBus.$emit('target','2'); //调用router回退页面 this.$router.go(-1); } }
3.页面接收参数
import eventBus from '../eventbus.js';//每次激活时 created(){ //根据key名获取传递回来的参数,data就是map eventBus.$on('target', function(data){ //赋值给首页的附近医院数据模型 this.activeTab = data; }.bind(this)); },
貌似需要使用keep-alive组件,由于一些限制,无法使用keep-alive。经过探索输出,发现eventBus时间在created事件发生之前就已经被调用。解决方法如下:在后一个页面created和mounted发生后前一个页面销毁之前发送数据
beforeDestroy() { console.log('准备发送了!!!'); eventBus.$emit('target', '2'); eventBus.$off('target'); },
参考文章:
Vue——eventBus使用,重复触发
https://blog.csdn.net/where_slr/article/details/101024169?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.channel_param