javascript - 如何在映射后映射另一个数组对象？

Question

我有看起来像的数据

[{subCategory: "subCategory", 
  name: "name",
  data: [{
  GradeName: "grade", 
  Population: "population",
  }]
}]

我正在我的组件中运行此代码

{currentCoinData.map((coin) => (
          <tr key={coin.id}>
            <td>{coin.subCategory}</td>
            <td>{coin.fullName || coin.coinName}</td>
            <td></td>
          </tr>
        ))}

如何将对象数组中的数据键映射到 td jsx 组件？

标签： javascriptreactjs

Answer 1

只需在 map 函数中使用另一个 map 函数：

{currentCoinData.map((coin) => (
          <tr key={coin.id}>
            <td>{coin.subCategory}</td>
            <td>{coin.fullName || coin.coinName}</td>
            {coin.data.map(item =>
                <td key={item.GradeName}>
                    {item.GradeName} {item.Population}
                </td>
            )}
          </tr>
        ))}