在 react const 中使用枚举答案

【问题标题】：Using enums in react const在 react const 中使用枚举
【发布时间】：2020-03-27 13:44:28
【问题描述】：

我需要将 enum 值映射到 1 个变量，然后调用该变量并检查该枚举是否存在。

render() {
    const {
        id,
        name,
        features} = this.props;
}

Features 是需要根据传入的枚举进行映射的变量。我会从 API 中得到类似的东西：

{"id":"111", "name":"jack", "features":["MOUNTAIN", "HILL"]}

所以总共会有 4 个不同的 features : MOUNTAIN, HILL, LAKE, FISH。
然后在需要时我可以检查：

if(features.mountain)
    //do stuff

【问题讨论】：

标签： reactjs dictionary enums constants react-props

【解决方案1】：

如果您想检查枚举中的给定属性（例如“MOUNTAIN”）是否包含在从 api 返回的 features 数组中，您可以使用 Array.prototype.includes() 方法：

if(featuresArrayfromApi.includes('MOUNTAIN'){
   //do stuff
}

如果您想检查从 api 返回的功能是否包含您的功能枚举中的一个或多个属性，您可以将includes 与Array.prototype.some() 结合使用。

例如，在 Typescript 中你可以这样写：

enum Features { MOUNTAIN, HILL, LAKE, FISH }

if(Object.keys(Features)
 .some(feature => featuresFromApi.includes(feature))){
   // do stuff
}

编辑

来自 api 数据的 features 键应该像任何其他键一样映射（id，name） - 只是保存一个数组，而不是保存 1 个值。然后，您可以在 if 子句中使用上面建议的验证。例如：

const data = [
    {"id":"111", "name":"jack", "features":["MOUNTAIN", "HILL"]},
    {"id":"222", "name":"john", "features":["FISH", "HILL", "LAKE"]}
    {"id":"333", "name":"joe", "features":["LAKE", "HILL", "FISH"]}

    ]

    data.map(record =>{

      console.log(record.id); 
      console.log(record.name);

      if (record.features.includes('MOUNTAIN'){
          // do stuff
        }          
    })

另外，请记住，enum 是一个 Typescript 符号，它在 Javascript 中不可用，所以如果你不使用 Typescript，你可以像这样声明它，它的工作原理是一样的：

const Features =  { 
 MOUNTAIN: "MOUNTAIN",
 HILL: "HILL",
 LAKE, "LAKE",
 FISH: "FISH" 
}

【讨论】：

感谢您的回答，但是您如何将此枚举映射到 const 变量？还是在声明Features 时会自行映射？此示例中的其他变量.. id、name 正在映射。
如果我理解这个问题，来自 api 数据的 features 键应该像任何其他键一样映射，它只保存任何数组而不是单个值。请查看我添加到问题中的“编辑” - 这是否回答了您的问题？