关于 Vue3 withDefaults 定义错误的问题?

作者站长头像
站长
· 阅读数 5

如下图,我只是简单的定义了两个 props,其中 tabLists 的类型是一个数组,但是 TS 为什么会报错呢?

关于 Vue3 withDefaults 定义错误的问题?

错误信息如下关于 Vue3 withDefaults 定义错误的问题?

是我哪里理解的又问题吗?

-------------根据采纳的答案,已经解决该问题-------------关于 Vue3 withDefaults 定义错误的问题?使用起来和 普通的 props 毫无任何差异关于 Vue3 withDefaults 定义错误的问题?

回复
1个回答
avatar
test
2024-07-05

解决方法:在默认值对象中将['1', '2']改为() => ['1', '2'],使用函数形式

原因:定义的类型any[]编译为运行时prop类型是Array,在运行时prop的Array类型默认值都是使用函数来定义,对象类型也是如此。

可以看源码中怎么定义这些类型的:简单类型可以直接写,复杂类型定义为方法

declare type InferDefault<P, T> = T extends null | number | string | boolean | symbol | Function ? T : (props: P) => T;

declare type InferDefaults<T> = {
    [K in keyof T]?: InferDefault<T, NotUndefined<T[K]>>;
};
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容