vue3 slot三種插槽使用,與作用域插槽傳值

2022-10-11 01:27:11 字數 1173 閱讀 6072

一,預設插槽和具名插槽

// 子元件

<

template

>

// 匿名插槽

<

slot

/>

// 具名插槽

<

slot

name

='title'

/>

template

>

// 父元件

<

template

#default

>

<

div

class

="tab-header"

>

<

span

>預設插槽

span

>

div>

template

>

<

template

#title

>

<

div

class

="tab-header"

>

<

span

>角色列表

span

>

<

el-button

class

="fr"

type

="primary"

>新增角色

el-button

>

div>

template

>

二. 作用域插槽

// 子元件

<

template

#default

="scope"

>

<

slot

:row

="scope.row"

>

slot

>

template

>

// 父元件

<

template

v-slot

="scope"

>

<

div

@click

="look(scope)"

>檢視

div>

template

>

Vue 三 使用slot(插槽)傳遞資料

父元件引用子元件時加入可編譯的 h2 class childstyle a wonderful quote p 在vue 為我們提供了乙個關鍵字 slot 標籤 用於插入可編譯 子元件中使用 div template 需要注意 即使插槽的實際 位於父元件中,但其樣式必須寫在子元件中 雖然這段 傳入到...

2020 12 07 Vue 三種基本的使用的辦法

1.直接引入cdn script 2.書寫你的內容 mas div 花括號來取值 newvue script body 3.效果圖 cnpm install vue cli g 接下來讓你選擇一些預設要生成的工具,不管直接回車 啟動 npm run serve 生成的打包檔案在記憶體中不會寫入磁碟用...

opencv3 note2 使用三種方式遍歷畫素

1.什麼是一幅影象 摘自 數字影象處理疑難解析 1.就單色影象而言,是乙個二維的光強函式f x,y 其中的x和y是空間座標,f x,y 正比於影象在該點的亮度值 若是一幅彩色圖,則f 是乙個向量,每乙個分量代表著乙個顏色分量 2.數字影象在空間座標和亮度值都離散化的影象f x,y 中,它可以用乙個或...