defineSlots

稳定性: 稳定

使用 defineSlots 可以在 <script setup> 中声明 SFC 中插槽的类型

在 Vue >= 3.3 中，此功能将默认关闭。

特性	支持
Vue 3	✅
Nuxt 3	✅
Vue 2	✅
Volar Plugin	✅

基本用法

简写语法

<script setup lang="ts">
defineSlots<{
  // 插槽名称
  title: {
    // 作用域插槽
    foo: 'bar' | boolean
  }
}>()
</script>

完整语法（官方版本）

<script setup lang="ts">
defineSlots<{
  title: (scope: { text: string }) => any
}>()
</script>

Volar 配置

// tsconfig.json
{
  "vueCompilerOptions": {
    "target": 3, // 或 2.7 用于 Vue 2
    "plugins": [
      "@vue-macros/volar/define-slots",
      // ...更多功能
    ],
  },
}