說明
插槽好比子組件留好位置，父組件寫好一個dom結構，包括樣式這些，然后把這個dom扔到子組件預留的空位中，（這只是形象記憶哈，，，，，，）
- 老版本的用法入口
常規用法
- 注意這里的寫法，老板本中是用一個等號
父組件中
<template>
<div>
<child/>
<!-- 指定這個結構傳到名字叫slot1的插槽 -->
<template v-slot:slot1>
<div>我是父組件傳遞過來的1</div>
</template>
<!-- 指定這個結構傳到名字叫slot2的插槽 -->
<template v-slot:slot2>
<div>我是父組件傳遞過來的2</div>
</template>
</child>
</div>
</template>
子組件中
<template>
<div>
<slot name="slot1"></slot>
<slot name="slot2"></slot>
</div>
</template>
作用域插槽
- 注意這里的寫法，老板本中是用slot-scope="props"獲取
父組件中
<template>
<child v-slot="{childDate}">
<div>{{childDate}}</div>
</child>
</template>
子組件中
<div>
<slot v-for="childDate in 10" :item="childDate" />
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/233526.html
標籤：其他
上一篇：UVCCamera的一些坑