lang
="en"
>
>
charset
="utf-8"
>
>
插槽title
>
head
>
>
>
>
slot
="slot1"
:up_value
="data_title"
>
up>
slot
="slot2"
:down_value
="book"
v-for
="book in books"
>
down
>
shouhe
>
div>
src=
"">
script
>
src=
"">
script
>
>
// 此處如果取名為content ，則 h1標籤和 ul 標籤就都會失效
// 因此content標籤也是 html 標籤中的乙個
// 所以 html 本身擁有的標籤不能使用
vue.
component
('shouhe',)
;//只能使用乙個根標籤，
//不能使用兩個根標籤
//屬性名不要使用大寫字母，因為瀏覽器會轉成小寫，導致一些問題
vue.
component
('up',}"
})vue.
component
('down',}"
})var vm =
newvue(}
)script
>
body
>
html
>
vue slot插槽的使用
vue官方文件在slot這部分講解的並不是很詳細，這裡用更通俗的語言進行描述。根據官檔的標題來開始吧 假如父元件的 如下 children為註冊的子元件 這裡是插槽的內容，位於子元件內部 渲染結果 這裡是子元件，注意 沒有加入slot標籤哦！上面的 實際效果如下 這裡是父元件 這裡是子元件，注意 沒...
Vue slot 插槽的使用
slot插槽作為分發內容的出口 假設看這篇文章的你已經有了一定的vue元件基礎 let btn vue.component btn template 1 上述 建立了乙個名為btn的全域性元件。接下來我們在其他頁面中呼叫這個外掛程式 let vm new vue template 得到的頁面效果如下...
vue slot插槽的使用
slot插槽的使用場景 父元件向子元件傳遞dom時會用到插槽 作用域插槽 當同乙個子元件想要在不同的父元件裡展示不同的狀態，可以使用作用域插槽。展示的狀態由父元件來決定 注 想要修改父元件向子元件傳遞的元素的樣式時，只能在對應的子元件進行修改 1.具名插槽的使用 父元件 slot header 我是...