Vue.js將道具傳遞給數據

我有2個組件：Post和Comments。Vue.js將道具傳遞給數據

裏面的郵件組件，有評論組件有3個道具：postId,numCom（評論數）和comments（數組）。

我得到的意見和我通過道具的陣列，現在我想要檢索的註釋組件陣列，並將其添加到數據，所以我可以再添加/刪除評論等

這裏是我的代碼Comments.vue：

props: ['id', 'numCom', 'comments'], 
data: function() { 
    return { 
    newMessage: "", 
    loading: false, 
    allComments: this.comments, 
    num: this.numCom, 
    } 
},

但這不起作用。在Vue開發人員工具中，我可以看到comments prop充滿了評論，但allComments數組爲空。

我該怎麼辦？

來源

2017-07-10 Learn Css

你確定了'comments'道具擁有當時被創建的組件的值？ –

我們需要看到更多的代碼，因爲我舉了一個例子，它爲我工作。 https://jsfiddle.net/7xxwq1e2/18/ – Stephen

@DecadeMoon是的，有一點延遲，因爲我正在做GET請求，然後填充道具...我應該如何解決這個問題？我可以在Comments組件中執行一個GET請求，但是當我顯示一個新帖子時，如何從Post控件觸發Comments組件中的一個函數？ –

它看起來像comments道具沒有在組件創建的時候（這是唯一的一次allComments將被設置）的值。

您可以：

推遲創建部件，直到comments支柱是通過使用v-if這樣準備：

<comments v-if="comments" :comments="comments"></comments>

注意對comments支柱的更改並將allComments設置爲新值（除初始化allComments數據功能）：

watch: { 
    comments(value) { 
    this.allComments = value; 
    } 
}

來源

2017-07-10 23:12:33

完美工作。謝謝！ –

Vue.js將道具傳遞給數據

回答

相關問題