vue插槽

Vue插槽（vue2.6及以后版本，新版插槽v-slot）

默认插槽

没有名字的插槽

// 父组件
<template>
    <p>默认插槽</p>
</template>

// 子组件
<slot></slot>

具名插槽

带名字的插槽

// 父组件
<template v-slot:title>
    <p>具名插槽</p>
</template>

// 子组件
<slot name="title"></slot>

作用域插槽

父组件可以获取子组件传过来的值

// 父组件
<template v-slot:item="props">
    <p>{{ props.value }}</p>
</template>

// 子组件
<slot name="item" v-bind="{ value: '作用域插槽' }"></slot>