【Vue】中三种插槽的使用
插槽：
1.匿名插槽：没有为插槽指定名称
2.具名插槽：为slot设置名字的插槽就称为具名插槽
3.作用域插槽：在封装组件的过程中，可以为预留的 插槽绑定 props 数据(除了name)，这种带有 props 数据的 叫做“作用域插槽
1.匿名插槽
子组件（假设名字为child）
<template>
<div>
<solt>这是一段文字<solt>
</div>
</template>
父组件（father）
<template>
<div>
<child></child>
</div>
</template>
2.具名插槽
子组件（child）
<template>
<div>
<slot></solt>
<solt name="one"><solt>
<solt name="two"><solt>
</div>
</template>
父组件（father）: 使用简写：v-slot:名字 或者 #名字
<template>
<div>
//没有设置名字的时候默认名字为name="default"
<template v-slot:default> 这是插入到one插槽的内容 </template>。
<template v-slot:one> 这是插入到one插槽的内容 </template>
<template #two> 这是插入到two插槽的内容 </template>
</div>
</template>
3.作用域插槽
子组件（child）
<template>
<div>
<slot name='ok'
:myname='username'
age='20'
:hobby='hobby'>我要传递用户名给父组件</slot>
</div>
</template>
父组件（father）
<template>
<div>
<template v-slot:ok="value"> //value是个对象
<span>{{value.myname}}</span>
<span>{{value.age}}</span>
<span>{{value.hobby}}</span>
</template>
</div>
</template>
