要實現的是在table裏面點擊操作按鈕彈出模態框.
父組件
父組件定義模態框狀態變量,默認爲不顯示
子組件
父組件向子組件傳值
使用v-bind可以傳遞表達式,變量。子組件接收傳的值
prop 都使得其父子 prop 之間形成了一個單向下行綁定,也就是說數據只能從父組件傳遞到子組件.反過來是不行 的。
點擊編輯按鍵,modalStatus改爲true,模態框顯示,現在關閉模態框後狀態值modalStatus需要在父組件改爲false,重新隱藏 ,prop只能單向傳遞,所以需要引入$emit, $emit有點像在子組件回調父組件方法 。
首先,在父組件定義回調方法
在標籤上引用
再在子組件中引用即可。
第一參數是回調方法,第二是值 。
總結: 父組件向子組件傳值,可以使用props,子組件向父組件傳值 ,使用$emit ,還有一個$ref,這個可以在父組件中調用子組件中變量與方法 。