在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 
    } 
}