在 VueJS 中更改道具时重新加载组件

Question

我正在使用以下代码来显示传递值“类别”的组件。类别根据用户交互而变化。但是，一旦加载了一个组件，它的数据不会根据 props 的变化而改变。

<button @click="selected='new'">Change</button>
<popup :category="selected"></popup>

data() {
    return {
      selected: 'test'
    }
  }

Answer 1

你将不得不把观察者上category 的 popup器件，如下列：

watch: {
  category: function(newVal){
    this.selected = newVal   // or this.openPopup(newVal) is this suits
  }
}