chainCall
Stability:
experimental
⚠️ Experimental feature, use at your riskExtends defineProps
, support call withDefaults
as a chain.
Features | Supported |
---|---|
Vue 3 | ✅ |
Nuxt 3 | ❓ |
Vue 2 | ❓ |
TypeScript | ✅ |
Volar Plugin | ❌ |
TIP
chainCall
does not supportdefinePropsRefs
- To fully support TypeScript, you need to import this macro from
vue-macros/macros
.
Basic Usage
vue
<script setup lang="ts"> const props = defineProps<{ foo?: string bar?: number[] baz?: boolean }>().withDefaults({ foo: '111', bar: () => [1, 2, 3], }) </script>
Compiled Code
vue
<script setup lang="ts"> const props = withDefaults( defineProps<{ foo?: string bar?: number[] baz?: boolean }>(), { foo: '111', bar: () => [1, 2, 3], }, ) </script>
Also support props destructuring and JSX:
vue
<script setup lang="ts"> const { foo } = defineProps<{ foo: string }>().withDefaults({ foo: '111', }) </script>
TypeScript
To fully support TypeScript, you need to import this macro from vue-macros/macros
with specific syntax.
vue
<script setup lang="ts"> import { defineProps } from 'vue-macros/macros' with { type: 'macro' } defineProps<{ /* ... */ }>().withDefaults({ /* ... */ }) // ✅ type safe </script>
Works without import assertion, but tsc will report an error:
ts
defineProps<{ /* ... */ }>().withDefaults({ /* ... */ })