猿问

vue 页面间eventBus传递参数赋值不起作用

在vue页面之间传递参数,但是传递成功,赋值却不成功

1、想要实现的效果:
页面A有一个按钮按下之后,会进入页面B,在页面B中点击列表项就会返回页面A,并带回列表项的数据

2、操作步骤:

  • 创建eventBus

    import Vue from 'vue'var eventBus=new Vue({});export default eventBus;
  • 页面B

import eventBus from 'eventBus.js';
//methods
 backData(item){
         eventBus.$emit('choiceAddress'item);
             this.$router.go(-1);
        
  }
  • 页面A

import eventBus from 'eventBus.js';//mountedeventBus.$on('choiceAddress', function(data){           console.log(data);//这里可以获得data,并赋值成功
           this.getAddress=data;
}.bind(this));console.log("this.getAddress"+this.getAddress)//在除了上面的方法中,外面获得的this.getAddress都没有赋值成功,是初始值

在页面A中可以获得页面B中传过来的参数,但是对 this.getAddress的赋值却在eventBus.$on函数之外的地方好似并没有进行赋值,仍然是原始值,

比如:
我想要在mounted的时候调用了一个方法,这个方法中console.log(this.getAddress);就会是原始值

mounted(){    this.a();
},
methods:{
   a(){
    console.log(this.getAddress);
    }
}

不是mounted中调用方法也是如此
请问这个值怎么能够赋值成功呢?


明月笑刀无情
浏览 3227回答 1
1回答

慕哥9229398

楼主,试试页面A获取数据的方法,写到 created 中,不要放到 mounted
随时随地看视频慕课网APP
我要回答