千鋒教育前端Vue3.0全套視頻教程(Kerwin2023版,Vue.js零基礎(chǔ)

插槽(Slot)是 vue 為組件的封裝者提供的功能,允許開發(fā)者在封裝組件時,把不確定的、希望由用戶指定的部分定義為插槽。
可以把插槽認(rèn)為是組件封裝期間,為用戶預(yù)留的內(nèi)容的占位符,在組件的使用者使用該組件時可以為插槽指定填充的內(nèi)容。
使用 v-slot 指令指定元素放在哪個插槽中,必須配合<template>
?元素,且一個<template>
?元素只能對應(yīng)一個預(yù)留的插槽,即不能多個<template>
?元素都使用 v-slot 指令指定相同的插槽。
在封裝組件的過程中,可以為預(yù)留的<slot>?
插槽綁定 props 數(shù)據(jù),這種帶有 props 數(shù)據(jù)的<slot>?
叫做“作用域插槽”。
作用域插槽,要顯示的數(shù)據(jù)已經(jīng)在組件中,以什么樣的樣式顯示數(shù)據(jù)(用什么標(biāo)簽和標(biāo)簽的樣式),可以由組件的使用者進(jìn)行指定。
獲取插槽綁定 props 數(shù)據(jù)的方法:
1.scope="接收的變量名":<template scope="接收的變量名">
2.slot-scope="接收的變量名":<template slot-scope="接收的變量名">
3.v-slot:插槽名="接收的變量名":<template v-slot:插槽名="接收的變量名">
標(biāo)簽: