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

Question

我正在使用以下代码来显示传递值'category'的组件。类别根据用户交互进行更改。然而，一旦一个组件被加载，其数据不会根据道具的变化而改变。

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

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

Answer 1

你将不得不把watcher上category在popup组件，如下列：

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