Vue中插槽指令

2022-01-12 19:18:20 字數 465 閱讀 6714

意義

示例

情況一:元件裡沒有設定外掛程式名稱,頁面中插槽中寫了插槽名稱結果頁面中插槽不會被渲染

情況二:元件裡有設定外掛程式名稱,頁面中插槽中沒寫了插槽名稱結果頁面中插槽不會被渲染

情況三:元件裡沒有設定外掛程式名稱,頁面中插槽中沒寫了插槽名稱結果頁面中插槽會被渲染

情況四:元件裡只寫了乙個插槽,頁面中寫了多個插槽中沒寫了插槽名稱結果頁面中插槽會被渲染而且依次排列顯示插槽的位置

情況五:元件裡只寫了n個插槽,頁面中寫了n個插槽中沒寫了插槽名稱結果頁面中插槽會被渲染而且依次排列顯示插槽的位置,且每個插槽位置都顯示n個,前提名字要一一對應

vue插槽樣式 vue中的插槽slot

插槽 slot 是元件的一塊html模板,父元件決定這塊模板顯不顯示以及怎麼顯示。位置由子元件自身決定 slot現在元件template的什麼位置,父元件傳過來的模板將來就顯示在什麼位置 匿名插槽 只能有乙個,可以放在元件的任何位置 在父元件在裡面寫了html模組 子元件的匿名插槽被下面的div模板...

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

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

vue插槽樣式 vue基礎之插槽

categories vue基礎 tags 插槽element ui 插槽slot 插槽 vue內建元件 做為承載分發內容的出口 普通插槽 插槽使用 全域性元件 第乙個引數是元件名,第二個引數是options vue.component vbtn template 我是頭部元件 var vconte...