提问人:uloco 提问时间:10/25/2021 最后编辑:uloco 更新时间:10/26/2021 访问量:568
嵌套对象键类型到映射的联合
Nested object keys type to mapped union
问:
我想创建一个类型,该类型遍历给定的嵌套类型并收集值所在的所有键,并将其设置为包含键的字符串的联合类型,同时遵循嵌套结构(也许是递归的?NestedKeys
RootNav
Nested<T>
type Nav = {
[key: string]: NestedNav<Nav> | object | undefined
}
type NestedNav<T extends Nav> = T
type RootNav = {
LoginNav: NestedNav<LoginNav>;
RegistrationNav: NestedNav<RegistrationNav>;
AppNav: NestedNav<AppNav>
}
type AppNav = {
MainNav: NestedNav<MainNav>;
FooScreen: undefined
BarScreen: {id: string}
};
type LoginNav = {
LoginScreen: undefined
}
type RegistrationNav = {
RegistrationScreen: undefined
}
type MainNav = {
HomeScreen: undefined
ProfileScreen: undefined
}
最终结果应该是
type NestedKeys<RootNav>
// → "RootNav" | "LoginNav" | "RegistrationNav" | "AppNav" | "MainNav"
我有这样的想法,但不知道如何正确地去做。这不起作用:
type NestedKeys<T extends Nav> = T[keyof T] extends NestedNav<any> ? NestedKeys<T[keyof T]> : T```
答:
2赞
captain-yossarian from Ukraine
10/26/2021
#1
这是可以做到的,但它需要对类型进行少量重构。
TypeScript 不支持 .javascript 中没有 like 的概念。这意味着具有某种类型,您无法获得类型名称的字符串表示形式。macros
value.toString
这就是我添加属性的原因:tag
type Prefix = `${string}Nav`
type Nav =
& Record<'tag', Prefix>
& {
[key: Prefix]: undefined | Nav
}
type NestedNav<T extends Nav> = T
type RootNav = {
tag: 'RootNav'
LoginNav: NestedNav<LoginNav>;
RegistrationNav: NestedNav<RegistrationNav>;
AppNav: NestedNav<AppNav>
}
type AppNav = {
tag: 'AppNav'
MainNav: NestedNav<MainNav>;
FooScreen: undefined
BarScreen: { id: string }
};
type LoginNav = {
tag: 'LoginNav';
LoginScreen: undefined
}
type RegistrationNav = {
tag: 'RegistrationNav';
RegistrationScreen: undefined
}
type MainNav = {
tag: 'MainNav';
HomeScreen: undefined
ProfileScreen: undefined
}
type DefaultTag<T> = T extends { tag: infer Tag } ? Tag : never
type GetNames<T, Cache extends any[] = [DefaultTag<T>]> =
(T extends string
? Cache[number]
: {
[Prop in keyof T]:
(T[Prop] extends { tag: infer Tag }
? GetNames<T[Prop], [...Cache, Tag]>
: GetNames<T[Prop], Cache>)
}[keyof T]
)
type Result = GetNames<RootNav>
type 表示任何导航名称。Prefix
type 表示有效的导航类型。Nav
type 以递归方式遍历 type,并在 type 存在时添加属性。GetNames
nav
tag
Cache
评论
NestedNav