chainCall

稳定性: 实验性 ⚠️ 实验性功能，风险自负

扩展 defineProps，支持链式调用 withDefaults。

Features	Supported
Vue 3	✅
Nuxt 3	❓
Vue 2	❓
TypeScript	✅
Volar Plugin	❌

TIP

chainCall 不支持 definePropsRefs。
你需要从 vue-macros/macros 中导入此宏以获取更好的类型检查。

基本用法

vue

<script setup lang="ts"> const props = defineProps<{  foo?: string  bar?: number[]  baz?: boolean }>().withDefaults({  foo: '111',  bar: () => [1, 2, 3], }) </script>

编译后的代码

vue

<script setup lang="ts"> const props
 = withDefaults
(  defineProps
<{  foo
?: string  bar
?: number[]  baz
?: boolean  }>(),  {  foo
: '111',  bar
: () => [1, 2, 3],  }, ) </script>

也支持 props 解构和 JSX：

vue

<script setup lang="ts"> const { foo } = defineProps<{ foo: string }>().withDefaults({  foo: '111', }) </script>

TypeScript

为了更好的类型支持，你需要使用特定的语法从 vue-macros/macros 中导入此宏。

vue

<script setup lang="ts"> import { defineProps
 } from 'vue-macros/macros' with { type: 'macro' }  defineProps
<{  /* ... */ }>().withDefaults
({  /* ... */ }) // ✅ 类型安全 </script>

没有 import 也可以正常使用，但 tsc 会报告一个类型错误：

defineProps
<{  /* ... */ }>().withDefaults({Property 'withDefaults' does not exist on type 'DefineProps<LooseRequired<{}>, never>'.
 /* ... */ })

贡献者

Kevin Deng

zhiyuanzmj

Alex

页面历史

最后编辑于 8 个月前

查看完整历史

chainCall ​

基本用法 ​

TypeScript ​

贡献者

页面历史

chainCall

基本用法

TypeScript