vue3:setup的兩個註意點詳解
在vue2中
父組件傳屬性給子組件
子組件接收屬性
如果沒有接收,則需要在$attrs裡才能收到,缺點是沒有對類型作限制,以及使用的時候名字比較長
使用的時候名字比較長
vue2,父組件在子組件裡使用插槽
打印插槽裡的內容
如果父組件使用瞭子組件2個插槽
父組件在子組件使用具名插槽
在vue3中
setup的註意點
setup生命周期在beforecreated之前
setup可以拿到兩個參數,props和context
給子組件傳2個屬性
打印context
context.attrs
與vue2類似,如果隻聲明部分,則剩下的在attrs屬性裡面
context.emit
給子組件添加監聽事件
context.slot
如果傳一個具名插槽
或者(推薦這種)
打印
如果傳2個具名插槽
總結
本篇文章就到這裡瞭,希望能夠給你帶來幫助,也希望您能夠多多關註WalkonNet的更多內容!
推薦閱讀:
- Vue3中的setup執行時機與註意點說明
- Vue3編程流暢技巧使用setup語法糖拒絕寫return
- vue3 文檔梳理快速入門
- Vue3常用的通訊方式總結與實例代碼
- 詳解Vue3.0 + TypeScript + Vite初體驗