Vue MacrosdefineProps
稳定性：
稳定使用 $defineProps 可以正确地解构 props 的类型
参见 Vue issue, Reactivity Transform RFC.
| 特性 | 支持 |
|---|---|
| Vue 3 | ✅ |
| Nuxt 3 | ✅ |
| Vue 2 | ✅ |
| TypeScript / Volar Plugin | ✅ |
WARNING
在开始之前，你必须先开启 响应性语法糖
基本用法
vue
<script setup lang="ts">
// ⬇️ ReactiveVariable<string[]>
const { foo } = $defineProps<{
foo: string[]
}>()
// ⬇️ Ref<string[]>
const fooRef = $$(foo)
</script>Volar 配置
jsonc
// tsconfig.json
{
"vueCompilerOptions": {
"target": 3,
"plugins": [
"@vue-macros/volar/define-props"
// ...更多功能
]
}
}