close

上次寫了如何使用父子方法互相使用，這次來說明，如何由父組件傳值 （Value）

假設情境如，如在父組件 table 中，checkbox 複選取多資料，傳入子組件，由子組件判斷其選擇的數量，子組件可顯示數選取的數量。

重點： props

Parents.vue

2017-10-31[17-38-(07)].jpg

 

Child.vue

2017-10-31[17-26-(20)].jpg

 

利用上方簡易的寫法，我們在父組件中，利用bind 的方式，將 parents_selected 的陣列，導入到 app-child 子組件中

而在子組件中，利用 props ，讓子組件知道父組件有傳來的資料，並宣告變量型態，此變量型態要正確，不然會報錯。

注意事項：

在規範中，父組件 bind 的部份要 child-selected 而在 子組件要寫成 childSelected ，特別要注意喔！

 

下一章再來寫，如何由子組件傳值（Value）給父組件

arrow
arrow
    全站熱搜

    雲橙雨林 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄