Question

我编写了简单的应用https://jsfiddle.net/9tvekf26/ 儿童部分获得props: ['isActive'], 并更改其值以使模式窗口可见：

data: function()
{
  return {
    isActive: this.isActive // value from props
  }
},

在closeModalWindow中，我正在更改标志并向父级发送消息：

  closeModalWindow: function()
  {
    this.isActive = false;
    bus.$emit('my-event', this.isActive)
    console.log("Children Window closed: ", this.isActive)
  },

在父母中，我正在听消息，更改状态为：

  mounted () {
    bus.$on('my-event', function (isActive) 
    {
      this.isActive = isActive
      console.log("Parent listened: ", this.isActive)
    });
  }

应用程序首次出现在模态窗口后停止工作的问题。

我哪里错了？

Answer 1

我不了解总线变量。我认为使用全局Vue对象不是一个好习惯。最好使用组件的this.。

我稍加修改一下您的代码：

我从子组件中发出一个事件：this.$emit(...)而不是bus.$emit(...)
父组件订阅子事件：@my-event="[method-name]"
我在方法中设置了isActive的新值

新的jsfiddle：https://jsfiddle.net/9tvekf26/17/

第二次单击后，道具不会影响孩子

1 个答案: