程序问答   发布时间:2022-06-01  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了如何从字符串数组构建 Typescript 类型?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

如何解决如何从字符串数组构建 Typescript 类型??

开发过程中遇到如何从字符串数组构建 Typescript 类型?的问题如何解决?下面主要结合日常开发的经验,给出你关于如何从字符串数组构建 Typescript 类型?的解决方法建议,希望对你解决如何从字符串数组构建 Typescript 类型?有所启发或帮助;

到目前为止我有这个。

export const Pacerthemes = ['Default','Dark Muted','Neon'] as const;
export type Pacertheme = typeof Pacerthemes[number];

type themePropertIEs = {
  exhaleHoldbordercolor: String;
  exhaleHoldcolor: String;
  inhaleHoldbordercolor: String;
  inhaleHoldcolor: String;
};

type themes = {
  Default: themePropertIEs;
  'Dark Muted': themePropertIEs;
  Neon: themePropertIEs;
};

有没有办法从 themes 数组生成 Pacerthemes 类型?

解决方法

您可以按照评论中的建议使用 Mapped type。

    type Themenames = "Default" | "Dark Muted" | "Neon";

    type ThemeProperties = {
      exhaleHoldBorderColor: String;
      exhaleHoldColor: String;
      inhaleHoldBorderColor: String;
      inhaleHoldColor: String;
    };

    type Themes = {
      [T in Themenames]: ThemeProperties;
    };

或者您可以使用 Record utility type

    type Themenames = "Default" | "Dark Muted" | "Neon";

    type ThemeProperties = {
      exhaleHoldBorderColor: String;
      exhaleHoldColor: String;
      inhaleHoldBorderColor: String;
      inhaleHoldColor: String;
    }

    type Themes = Record<Themenames,ThemeProperties>

TS Playground

,

这是一个解决方案 (Playground link):

const PacerThemes = ['Default','Dark Muted','Neon'] as const


type ThemePropertiesVersion = {
  [k in (typeof PacerThemes)[keyof typeof PacerThemes & number]]: "YourType"
}

如果您想通过引入一些可重用的辅助类型来使其更通用,您可能会遇到 readonly anY[] 不扩展 anY[] 的问题。

例如,这行不通,因为 typeof PacerThemesreadonly

type Items<A extends anY[]> = A[keyof A & number]

要处理此问题,您可以这样做 (Playground link):

const PacerThemes = ['Default','Neon'] as const


// Version 1 -- allow only readonly arrays

type ReadonlyItems<P extends readonly anY[]> = P[keyof P & number]

type TestVersion1 = NonReStrictiveItems<typeof PacerThemes>

type ThemePropertiesVersion1 = {
  [k in ReadonlyItems<typeof PacerThemes>]: "YourType"
}


// Version 2 -- allow both

type NonReStrictiveItems<P extends (readonly anY[]) | anY[]> = P[keyof P & number]

type TestVersion2 = NonReStrictiveItems<typeof PacerThemes>

type ThemePropertiesVersion2 = {
  [k in NonReStrictiveItems<typeof PacerThemes>]: "YourType"
}

大佬总结

以上是大佬教程为你收集整理的如何从字符串数组构建 Typescript 类型?全部内容,希望文章能够帮你解决如何从字符串数组构建 Typescript 类型?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:类型?