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
chainCalldoes not supportdefinePropsRefs- To fully support TypeScript, you need to import this macro from
unplugin-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 unplugin-vue-macros/macros with specific syntax.
vue
<script setup lang="ts">
import { defineProps } from 'unplugin-vue-macros/macros' with { type: 'macro' }
defineProps<{
/* ... */
}>().withDefaults({
/* ... */
})
// ✅ type safe
</script>Works without import assertion, but tsc will report an error:
ts
defineProps<{
/* ... */
}>().withDefaults({ /* ... */
})
Kevin Deng
zhiyuanzmj
Alex