插槽

在 2.6.0 中，具名插槽和作用域插槽变为 v-slot 指令。它取代了 slot 和 slot-scope 这两个目前已被废弃但未被移除且仍在文档中的 attribute。新语法的由来可查阅这份 RFC。

插槽声明

• 默认插槽：<slot/>

• 具名插槽：<slot name="header"></slot>

• 作用域插槽：<slot v-bind:user="user"></slot>

• 动态插槽:动态参数 v-slot:[dynamicSlotName]

插槽传递

1. 默认插槽

   <template v-slot:default="slotProps"> {{ slotProps.user.firstName }}   </template>
   

2. 默认插槽的数据传递：v-slot:default='slotProps'或者 v-slot="slotProps"
3. 具名插槽

   <template v-slot:header>
         <h1>Here might be a page title</h1>
   </template>
   

4. 具名插槽的数据传递：v-slot:footer="slotProps"
5. 解构插槽：v-slot="{user:person}"

1.只有默认插槽时,v-slot可以写在组件上,否则请写在template上

2.*具名插槽的缩写：v-slot:default===#default*

3.默认插槽的缩写语法不能和具名插槽混用