时间戳

首页 > 解决方案 > 将枚举映射到值

javascript - 将枚举映射到值

问题描述

我正在使用徽章组件

<Badge statusColour={value} label={value} />

从 API 中，我得到一个具有以下枚举的状态：

enum Status {
  Requested = 'Requested',
  Approved = 'Approved',
  Declined = 'Declined',
}

Badge 组件 statusColour 属性仅采用以下颜色字符串：“attention”、“resolved”、“rejected”。

每个 Status 枚举都有它对应的 statusColour

  Requested = 'attention',
  Approved = 'resolved',
  Declined = 'rejected',

有没有办法将 Status 枚举映射到颜色字符串，以便当我像这样使用 Badge 组件时：

const value = Status.Requested
<Badge statusColour={value} label={value} />

status 中的值是：'attention'

标签中的值为：“已请求”

ps 我正在使用 TypeScript。

标签： javascripttypescriptenumsmapping

解决方案

StatusColor[value]您可以通过索引状态颜色枚举（即）来查找它。

完整示例

enum Status {
  Requested = 'Requested',
  Approved = 'Approved',
  Declined = 'Declined',
}

enum StatusColor {
  Requested = 'attention',
  Approved = 'resolved',
  Declined = 'rejected',
}

const valueToColor = (value: Status): StatusColor => StatusColor[value];

console.log(valueToColor(Status.Requested)); // attention

推荐阅读