Vue 插槽 具名插槽 作用域插槽 其他

2021-09-25 17:42:38 字數 716 閱讀 7789

自 2.6.0 起有所更新。已廢棄的使用 slot 特性的語法在這裡。
有時我們需要多個插槽。例如對於乙個帶有如下模板的 元件：（此元件中的插槽為非具名插槽）
對於這樣的情況， 元素有乙個特殊的特性：name。這個特性可以用來定義額外的插槽：（對非具名插槽進行修改完善， 成為以下的具名插槽，下面的**為乙個元件）
乙個不帶 name 的 出口會帶有隱含的名字「default」。

在向具名插槽提供內容的時候，我們可以在乙個 元素上使用 v-slot 指令，並以 v-slot 的引數的形式提供其名稱：（在使用具有具名插槽的元件的**）

a paragraph for the main content.


and another one.


here's some contact info
現在 元素中的所有內容都將會被傳入相應的插槽。任何沒有被包裹在帶有 v-slot 的 中的內容都會被視為預設插槽的內容。

插槽 具名插槽 作用域插槽

一 插槽 當子元件的有一部分內容是根據父元件傳過來的dom顯示的時候,可以使用插槽 通過插槽，父元件向子元件優雅的傳遞dom結構，同時子元件使用插槽的內容，通過 body well 二 具名插槽 slot header header slot footer footer 三 作用域插槽 作用域插槽 ...

Vue中的插槽 具名插槽 作用域插槽

1 vue中插槽的作用和使用方法 定義乙個名cmpone子元件，為該子元件新增內容應該在子元件的template中定義，直接在父元件的標籤中裡定義的內容不會被渲染，如下例 使用插槽後渲染的內容span cmp one div const cmpone const vm newvue script 結...

Vue插槽slot 預設插槽 具名插槽 作用域插槽

1.什麼插槽 插槽也成為內容分發 用slot這個內建元件 2.插槽是幹什麼的 在子元件中來顯示父元件中的資料 3.插槽怎麼用 4.在子元件中用括起來乙個區域 5.在父元件的子元件標籤中給插槽傳遞資料，如果父元件不傳輸資料那6.麼直接顯示標籤中的資料 7.插槽的分類 插槽可以分為三類 預設插槽 具名插...