如何将常量映射为字符串？TypeScript类型定义问题求助

TypeScript 的字符串枚举不允许使用计算属性值（仅支持字符串字面量直接赋值），因此你用变量作为枚举成员值的写法会触发报错。以下两种方案可满足你的需求：

方案一：对象字面量+联合类型（推荐，便于统一维护） #

通过 as const 让 TypeScript 推断出具体的颜色值类型，再提取为联合类型：

// 定义颜色映射对象，用as const锁定值类型为具体字符串
const colorMap = {
  red: '#C62828',
  blue: '#01579B',
  orange: '#E65100'
} as const;

// 从映射对象中提取所有值的联合类型
type Colors = typeof colorMap[keyof typeof colorMap];

// 重新定义Foo类型
type Foo = {
  bold?: boolean;
  italic?: boolean;
  color: Colors;
};

// 合法使用示例
const validFoo: Foo = {
  color: colorMap.red // 实际值为#C62828，符合类型要求
};

// 非法使用会报错（比如传入未定义的颜色）
const invalidFoo: Foo = {
  color: '#FFFFFF' // TypeScript会提示类型不匹配
};

方案二：直接使用常量联合类型 #

如果不需要键名映射，直接用常量值组成联合类型：

// 用as const锁定每个常量的类型为具体字符串
const col1 = '#C62828' as const;
const col2 = '#01579B' as const;
const col3 = '#E65100' as const;

// 定义颜色联合类型
type Colors = typeof col1 | typeof col2 | typeof col3;

type Foo = {
  bold?: boolean;
  italic?: boolean;
  color: Colors;
};

// 使用示例
const validFoo: Foo = {
  color: col1 // 正确，实际值为#C62828
};

两种方案均满足你的要求：

• 仅允许传入指定的颜色值
• 可直接获取颜色的实际字符串值（如 #C62828）

内容的提问来源于stack exchange，提问作者four-eyes