动态使用ENUMS作为SELECT（REACTJS）中的选项TAG

Question

我有下面列出的ENUMS

export declare enum UserStatus {
    NEW = "NEW",
    REGISTERED = "REGISTERED"
}

我如何确保可以将这种动态方式用作select标签的下拉项。我在几个站点上在线搜索，但没有找到合适的答案。有人可以帮忙吗。

目前，我正在以这种方式进行硬编码。

<select value={selectedUserStatus} onChange={onUserStatusSelect}>
      <option
        aria-selected="true"
        key={UserStatus.NEW}
        value={UserStatus.NEW}
      >
        {UserStatus.NEW}
      </option>
      <option
        aria-selected="true"
        key={UserStatus.REGISTERED}
        value={UserStatus.REGISTERED}
      >
        {UserStatus.REGISTERED}
      </option>
    </select>

Answer 1

如果使用的是JSX语法，则应该可以使用JSX元素数组替换元素内部的标记，如下所示：

<select value={selectedUserStatus} onChange={onUserStatusSelect}>
    Object.keys(UserStatus).map(key => (
        <option
            aria-selected="true"
            key={UserStatus[key]}
            value={UserStatus[key]}
        >
            {UserStatus[key]}
        </option>
        )
    )
</select>