vue 如何使用遞歸組件
有的時候我們會使用二級標(biāo)題,什么叫做二級標(biāo)題?先看看傳過來的數(shù)據(jù)。類似于這種,數(shù)組中還有一個數(shù)組,有的人可能會說那就用兩個v-for嵌套使用啊,但是這里,我們想要它們是同樣的功能,同樣的樣式,所以使用遞歸組件是最好的選擇。
遞歸組件:在組件的自身再調(diào)用組件的自身。
組件一般要給個名字,方便我們使用遞歸組件的時候來使用,如果我自身有children,就把children當(dāng)做list再傳給自己,做一個遞歸的循環(huán)。
此時就渲染出來了。
如果我再增加一個children呢?像這樣:
此時不用做任何事,只改變了數(shù)據(jù)結(jié)構(gòu),去看瀏覽器渲染的頁面:
三級標(biāo)題就出來了,而我們只修改了數(shù)據(jù)結(jié)構(gòu),模板處沒有動任何地方。這就是遞歸組件的使用,只要children存在,就調(diào)用自身。如果用v-for來寫,可能還要寫一層循環(huán)。
tips 關(guān)于name的一些使用
每一個組件內(nèi)的name值到底是做什么用的呢?
1. 當(dāng)我們做遞歸組件會用到2.在頁面上想對某個頁面取消緩存,keep-alive exclude='xxname'3.Vue的開發(fā)者調(diào)試工具,會顯示一個個組件名,取決于這個name
我目前所知大概就是這些用途了,以后發(fā)現(xiàn)了新的用途會再更新的。
以上就是vue 如何使用遞歸組件的詳細(xì)內(nèi)容,更多關(guān)于vue 使用遞歸組件的資料請關(guān)注好吧啦網(wǎng)其它相關(guān)文章!
相關(guān)文章:
1. .NET SkiaSharp 生成二維碼驗(yàn)證碼及指定區(qū)域截取方法實(shí)現(xiàn)2. css代碼優(yōu)化的12個技巧3. HTTP協(xié)議常用的請求頭和響應(yīng)頭響應(yīng)詳解說明(學(xué)習(xí))4. idea設(shè)置提示不區(qū)分大小寫的方法5. CentOS郵件服務(wù)器搭建系列—— POP / IMAP 服務(wù)器的構(gòu)建( Dovecot )6. ASP.NET MVC通過勾選checkbox更改select的內(nèi)容7. Django使用HTTP協(xié)議向服務(wù)器傳參方式小結(jié)8. IntelliJ IDEA創(chuàng)建web項(xiàng)目的方法9. django創(chuàng)建css文件夾的具體方法10. 原生JS實(shí)現(xiàn)記憶翻牌游戲
