React + Typescript领域初学者的常见问题和技巧

🚀 优质资源分享 🚀

学习路线指引（点击解锁）	知识定位	人群定位
🧡 Python实战微信订餐小程序 🧡	进阶级	本课程是python flask+微信小程序的完美结合，从项目搭建到腾讯云部署上线，打造一个全栈订餐系统。
💛Python量化交易实战💛	入门级	手把手带你打造一个易扩展、更安全、效率更高的量化交易系统

React + Typescript领域初学者的常见问题和技巧

创建一个联合类型的常量 Key

const NAME = {
  HOGE: "hoge",
  FUGA: "fuga"
} as const;
keyof typeof NAME
// => "HOGE" | "FUGA"

创建常量值的联合类型

typeof NAME[keyof typeof NAME]
// => "hoge" | "fuga"

沮丧

const { hoge, piyo } = router.query as {
  hoge: string;
  piyo: string;
};

强制向下

有危险，但是…

const { hoge, piyo } = router.query as unknown as {
  hoge: number;
  piyo: number;
};

Material-Extend UI 类型

基本上它是由命名约定“组件名+Props”提供的，所以使用它。

type ExtendsProps = TextFieldProps & {
 hoge: number;
};

使用 Material-UI 属性类型