vue中的插槽,你會了嗎(看了必會系列哦!!!)

2021-10-09 21:13:03 字數 1431 閱讀 8816

插槽:給元件模板傳遞的引數

可以將插槽理解為函式中的形參

1.普通插槽:

slot標籤宣告乙個區域,用來存放實參

hel//slot標籤中的內容為預設值

你好//此時你好會替換掉hel

注意:

如果為slot新增了name屬性,則普通插槽中的內容就插不上去,即會顯示預設值

2.具名插槽:

即給插槽起名字

1.給slot起名字,通過name屬性

hel2.使用時,通過你好

3.作用域插槽

1.在solt標籤中通過v-bind繫結插槽可以使用的屬性

hel2.使用時,在template標籤中,使用v-slot:default='scope'

scope:template標籤中可以使用的作用域物件,scope為自己隨便取的值

}--}

具體**案例:

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

document<

/title>

"../vue.js"

>

<

/script>

window.

onload

=function()

, methods:

, components:

, list:[1

,2,3

,4,5

]}},

template:

` hel

helhel

hello

world

`}}}

)}<

/script>

<

/head>

>

default

='scope'

>}--

}<

/template>

你好<

/template>

小仙女<

/template>

<

/myarticle>

<

/div>

<

/body>

<

/html>

你買的課程看了嗎?

前段時間 極客時間 做企業權益活動的時候,我和其它同事購買了一批課程。但每門課程只能學習30天,就寫了個指令碼 詳情可以看另一篇文章 把課程儲存到了本地 markdown 或 html 文字 儲存下來的極客時間課程 這一批課程儲存下來後基本上都躺在磁碟裡沒動過了 和網盤中躺著的一堆學習資料同樣的命運...

vue插槽樣式 vue中的插槽slot

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

最高效的oracle分頁語句,你會了嗎?

1 無order by排序的寫法。效率最高 經過測試,此方法成本最低,只巢狀一層,速度最快!即使查詢的資料量再大,也幾乎不受影響,速度依然!select from select rownum as rowno,t from emp t where hire date between to date ...