v-slot

• 缩写：#

• 预期：可放置在函数参数位置的 JavaScript 表达式 (在支持的环境下可使用解构)。可选，即只需要在为插槽传入 prop 的时候使用。

• 参数：插槽名 (可选，默认值是 default)

• 限用于

  • <template>
  • 组件 (对于一个单独的带 prop 的默认插槽)
• 用法：

提供具名插槽或需要接收 prop 的插槽。

• 示例：

<!-- 具名插槽 -->
<base-layout>
  <template v-slot:header>
    Header content
  </template>
  Default slot content
  <template v-slot:footer>
    Footer content
  </template>
</base-layout>
<!-- 接收 prop 的具名插槽 -->
<infinite-scroll>
  <template v-slot:item="slotProps">
    <div class="item">
      {{ slotProps.item.text }}
    </div>
  </template>
</infinite-scroll>
<!-- 接收 prop 的默认插槽，使用了解构 -->
<mouse-position v-slot="{ x, y }">
  Mouse position: {{ x }}, {{ y }}
</mouse-position>

更多细节请查阅以下链接。

• 参考：

  • 组件 - 插槽
  • RFC-0001