詳解Vue slot插槽
1.作用:讓父組件可以向子組件指定位置插入html結(jié)構(gòu),也是一種組件間通信的方式,適用于父組件===>子組件(傳的是HTML格式)。
父組件App:

子組件Category:

在父組件或者子組件里都可以給插槽中的內(nèi)容設(shè)置樣式,效果一樣
作用域插槽:
1.理解:數(shù)據(jù)在組件的自身(Category),但根據(jù)數(shù)據(jù)生成的結(jié)構(gòu)需要組件的使用者(APP)來決定。(games數(shù)據(jù)在Category組件中,但使用數(shù)據(jù)所遍歷出來的結(jié)構(gòu)由App組件決定)
子組件在給父組件傳數(shù)據(jù)
子:

父:
使用atguigu這樣一個對象接收是因為可能傳了多個值

作用域插槽也可以有名字name
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
使用Vue-Office實現(xiàn)Office文件預(yù)覽組件
在現(xiàn)代Web應(yīng)用中,Office 文件的預(yù)覽是一個常見的需求,本文將使用Vue-Office實現(xiàn)Office文件預(yù)覽組件,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2025-03-03
Vue 自定義標(biāo)簽的src屬性不能使用相對路徑的解決
這篇文章主要介紹了Vue 自定義標(biāo)簽的src屬性不能使用相對路徑的解決,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
vue實現(xiàn)彈框遮罩點擊其他區(qū)域彈框關(guān)閉及v-if與v-show的區(qū)別介紹
vue如何簡單的實現(xiàn)彈框,遮罩,點擊其他區(qū)域關(guān)閉彈框, 簡單的思路是以一個div作為遮罩,這篇文章給大家詳細(xì)介紹了vue實現(xiàn)彈框遮罩點擊其他區(qū)域彈框關(guān)閉及v-if與v-show的區(qū)別介紹,感興趣的朋友一起看看吧2018-09-09
vue ElementUI的from表單實現(xiàn)登錄效果的示例
本文主要介紹了vue ElementUI的from表單實現(xiàn)登錄效果的示例,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09

