javascript - 两个vuejs实例之间通信

Question

我有 2 个独立的 vue js 实例。我需要将一个值从一个实例传递到另一个实例。我可以传递它，但无法在模型中绑定(bind)该值。这就是我将信息从一个实例传递到另一个实例的方式

var holiday = new Vue({});

从一个实例发出值

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

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

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

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

Answer 1

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

因此使用箭头函数，以便 this 进行词法绑定(bind)

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

或在已安装的钩子(Hook)中设置var self = this，以便回调在指向vue实例的self上有一个闭包

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