将枚举映射到值

Question

我正在使用 Badge 组件

<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} />

状态中的值为：'attention'

标签中的值为：'Requested'

p.s。我正在使用 TypeScript。

Answer 1

您可以通过索引状态颜色枚举（即 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

将枚举映射到值

Mapping enum to value

javascript

mapping

enums

typescript

完整示例