TypeScript中如何用自定义联合类型声明React状态 解决类型报错

typeof是TS中仅用于从运行时实际存在的值（常量、对象、函数等）反推对应类型的操作符，不能作用于纯类型声明
你定义的AVAILABLE_API_STATUS本身就是纯类型别名，编译阶段会被完全擦除，根本不会出现在运行时代码里。给它前面加typeof，会让TS尝试从一个不存在的运行时实体上提取类型，最终得到的类型是never，自然无法识别你传入的初始值"Refused"的合法性。

之前TS提示你需要在类型名前加typeof，属于错位的错误提示：你在使用这个类型的组件文件中，根本没有正确导入这个类型别名，TS找不到对应的类型定义，误把这个标识符当成了未定义的运行时变量，才给出了错误的引导方向。

• 第一步：在组件文件顶部完成类型导入

  // 推荐使用type关键字明确为类型导入，避免无意义的运行时模块引入
  import type { AVAILABLE_API_STATUS } from "该类型定义的源文件路径";
  

• 第二步：直接将类型传入useState的泛型参数，无需额外添加操作符

  // 可正常运行的正确写法
  const [status, setStatus] = React.useState<AVAILABLE_API_STATUS>("Refused");
  

• 遇到TS提示需要加typeof时，不要盲目按照提示修改，先检查是不是漏了对应类型/值的导入。
• 纯类型声明的标识符，永远不要在前面加typeof，二者的作用域完全不重叠。

内容的提问来源于stack exchange，提问作者darkflame。