vuejs 两个实例之间的通信

Question

我有 2 个独立的 vue js 实例。我需要将一个值从一个实例传递到另一个实例。我可以传递但不能在 model.This 中绑定该值是我将信息从一个实例传递到另一个实例的方式

var holiday = new Vue({});

从一个实例发出值

holiday.$emit('holiday_id',{
    holiday_id : response.data.id
});

每当安装第二个实例时接收假期 ID。之后无法在模型中绑定该值

mounted() {
    holiday.$on('holiday_id', function(holiday){
        this.temp_holiday_id = holiday.holiday_id;
    });
}

我做错了什么，任何帮助将不胜感激。

Answer 1

您在事件侦听器的回调中使用了常规函数。所以 this 没有指向 vue 实例，这就是你无法访问和修改 this.temp_holiday_id 的原因在你的数据中属性

因此使用箭头函数，以便 this 在词法上绑定

mounted() {
    holiday.$on('holiday_id', (holiday) => {
        this.temp_holiday_id = holiday.holiday_id;
    });
}

或在挂载的钩子中设置 var self = this 以便回调在指向 vue 实例

的 self 上有一个闭包

mounted() {
    var self = this;
    holiday.$on('holiday_id', function(holiday){
        self.temp_holiday_id = holiday.holiday_id;
    });
}

Communicate between two instances vuejs