1.父傳子掌腰,子接受用props
? a.父組件中要做的事情
? ? ? 在父組件中引入子組件:
并在components中聲明該組件
b.子組件中要做的事情
? ? ?在子組件中props的方式接受齿梁,這里有兩種方法:props:['rules','model'],還有就是圖片中對象的方式芦拿,只是對象的方式能夠設(shè)定傳值的類型。
在子組件中的使用如第二個紅色的標出的部分酵幕,直接使用? this.rules
2.子傳父缓苛,子用$emit(派發(fā)自定義事件)
父子組件間傳值是單向數(shù)據(jù)流,即父傳子笔刹,但是子不能修改被傳過來的數(shù)值,如果子要修改還需通知父組件來修改(目前學(xué)到的內(nèi)容來說是這樣的)冬耿,所以父傳子的時候,是傳遞事件日月,并在父組件中調(diào)用該函數(shù)
a.父組件要做的
在父組件中引入子組件缤骨,如圖所示
第二幅圖绊起,即為綁定的事件傳參即為子傳給父的數(shù)據(jù)
b.子組件
3.父子組件數(shù)據(jù)的雙向綁定
在子中改父中也可以檢測到,就像v-model一樣栅表,(v-model是value="inputvalue" @input="inputHandler"封裝的語法糖)
在子組件中的設(shè)置:
此處的 :value="inputvalue" @input="inputHandler" 就是實現(xiàn)與父組件雙向綁定的關(guān)鍵