Vue學習筆記 作用域插槽

有時候我們希望子元件的內容由父元件決定如何展示，這個時候子元件的資料父元件並不能訪問到，而作用域插槽的關鍵之處就在於，父元件能接收來自子元件的slot傳遞過來的引數。

<

div 
id>
<
cpn>
cpn>
<
cpn>
<
template 
slot-scope
="slot"
>
<
span
>}-
span
>
template
>
cpn>
div>
<
template 
id="cpn"
>
<
div 
style
="display: flex;flex-direction: row"
>
<
slot 
:data
="planguage"
>
<
ul>
<
li v-for
="item in planguage"
>}
li>
ul>
slot
>
div>
template
>
body
>
<
script 
src=""
>
script
>
<
script
>
const cpn 
=        }
}=new
vue(
})script
>

在父元件使用我們的子元件時，從子元件中拿到資料：

我們通過獲取到slot屬性
在通過slot.data就可以獲取到剛才我們傳入的data了

lua學習筆記 作用域

塊，作用域 全域性和區域性，預設情況下，為全域性變數，除非特殊說明是區域性 中 do end塊內定義的變數無法被外部訪問，同時任何在外圍定義的區域性變數也無法被內部訪問。強制轉換 根據特定的轉換規則 如果可能的話 將字串轉換成數字，從而在字串和數字之間實現算術運算的過程 這裡先將b轉換成數字，然後再...

Vue作用域插槽

root 父元件呼叫子元件的時候，給子元件傳了乙個插槽 這個插槽叫作用域插槽 作用域插槽必須以 template開頭和結尾 同時這個插槽要宣告 你要從子元件接收的資料都放在哪 這裡是放在props裡面了 還要告訴子元件模板的資訊 即接收的props怎麼展示資料 props tony h4 templ...

Vue作用域插槽

doctype html en utf 8 編譯作用域 title script head isshow cpn div cpn 我是子元件 h2 我是子元件的內容 p isshow 按鈕 button div template newvue components script body html ...