關(guān)于Vue3中defineProps用法圖文詳解
之前只是單純的會(huì)用,因?yàn)関ue關(guān)于父子組件通訊差別有一點(diǎn)點(diǎn)大。
1.在父組件內(nèi)傳遞變量的時(shí)候,需要加冒號(hào):
,否則你就只是單純的傳遞了一個(gè)字符串而已。
2.在子組件里不需要引入defineProps
就可調(diào)用該函數(shù)去接收父組件傳來的屬性。
我個(gè)人在這里給自己提醒?,可能我太迷糊了。
這里需要注意?。∵@是defineProps
API是一個(gè)函數(shù),它的返回值就是父親傳來的屬性。
3.剛開始讓我感到奇怪的是,我好像不用變量去接收,在template
里也能正常使用。
那我還用變量接收干啥呢?這個(gè)API的返回值有毛線用啊?
也不用像React那樣變量前面都得加一個(gè)props.
才可以訪問,也沒有結(jié)構(gòu)去拿。這么方便嗎?
4.恍然大悟
原來在script
標(biāo)簽里直接拿屬性用是拿不到的…
這里變量名不一定非得是props
,js可并沒有規(guī)定不允許漢字作為變量名哦
下次聊聊defineEmits
,主要react的一些思想還沒完全轉(zhuǎn)變到vue上,還需努力!
總結(jié)
到此這篇關(guān)于關(guān)于Vue3中defineProps用法的文章就介紹到這了,更多相關(guān)Vue3中defineProps用法內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
vue treeselect獲取當(dāng)前選中項(xiàng)的label實(shí)例
這篇文章主要介紹了vue treeselect獲取當(dāng)前選中項(xiàng)的label實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08前端vue如何通過URL訪問存儲(chǔ)在服務(wù)器或磁盤的圖片
在Vue中,通常需要將圖片存儲(chǔ)在服務(wù)器端,并通過url地址來訪問,下面這篇文章主要給大家介紹了前端vue如何通過URL訪問存儲(chǔ)在服務(wù)器或磁盤的圖片的相關(guān)資料,需要的朋友可以參考下2024-02-02vue自定義權(quán)限標(biāo)簽詳細(xì)代碼示例
這篇文章主要給大家介紹了關(guān)于vue自定義權(quán)限標(biāo)簽的相關(guān)資料,在Vue中你可以通過創(chuàng)建自定義組件來實(shí)現(xiàn)自定義標(biāo)簽組件,文中給出了詳細(xì)的代碼示例,需要的朋友可以參考下2023-09-09基于vue3.0.1beta搭建仿京東的電商H5項(xiàng)目
這篇文章主要介紹了基于vue3.0.1beta搭建仿京東的電商H5項(xiàng)目,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05Vue重要修飾符.sync對(duì)比v-model的區(qū)別及使用詳解
這篇文章主要為大家介紹了Vue中重要修飾符.sync與v-model的區(qū)別對(duì)比及使用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07