访问 React 对象数组中的所有属性答案

【问题标题】：Accessing all properties in array of objects for React访问 React 对象数组中的所有属性
【发布时间】：2020-09-09 17:54:15
【问题描述】：

我正在为《魔法门之英雄无敌III》构建一个搜索引擎，我想检查输入的单位名称是否与我建立的数据库中的单位名称匹配。我目前有一个大型 JSON 文件，其中包含一组对象，每个对象都有一个 name 属性。目前我正在处理的代码如下所示：

 return (
    <div className="main-content">
      <h2>{name}</h2>

      {name === CastleUnits[0].Name && <UnitContainer data={CastleUnits} />} 
      {name === CastleUnits[1].Name && <UnitContainer data={CastleUnits} />} 


    </div>
  );

'name' 是在搜索中传递的内容，CastleUnits[0].Name 适用于第一个单元。我试图用 for 循环解决这个循环，但我收到了一个错误。

【问题讨论】：

题外话，您是否正在从 VCMI 检索和存储数据？比任何事情都更好奇数据的来源。如果您尝试查找单个 (1) 匹配项，例如作为搜索查询 const match = CastleUnits.find(c => c.Name === 'whatever')，则很有帮助。其他你可以使用filterconst matches = CastleUnits.find(c => c.Name.toLowerCase().includes('whatever'))

标签： javascript arrays reactjs object jsx

【解决方案1】：

您需要像这样过滤和映射数组：

    return (
      <div className="main-content">
        <h2>{name}</h2>    
        {CastleUnits.filter(e => e.Name = name).map(e => <UnitContainer data={e} />)}
      </div>
    );

【讨论】：