javascript - 如何在 React 中使用 map 中的 map ？

Question

我有这样的对象:

[{a:1, 行数:[]},{a:2,行数:[]}]

我想将 a 映射为表格列，将行映射为单元格。

我正在尝试这样:

  <thead>
    <tr>
      {doc.map(({
        _id, rfqID, supplier, notes, rows,
      }) => (
          <th>{supplier}</th>
        ))}
    </tr>
  </thead>
  <tbody>
    {rows.map(({ offerPrice }) => (
      <tr>
        <td>1</td>
        <td>{offerPrice}</td>
      </tr>
    ))}
  </tbody>

但我得到 Uncaught ReferenceError: rows is not defined用标题和项目映射此表的正确语法是什么？

Answer 1

由于 doc 是对象数组，您需要在 doc 上进行映射并再次映射到行上以显示报价

  <thead>
    <tr>
      {doc.map(({
        _id,
        rfqID,
        supplier,
        notes,
        rows,
      }) => 
        <th key={_id}>{supplier}</th>
      )}
    </tr>
  </thead>
  <tbody>
  {doc.map(({ rows }) => 
    rows.map((offerPrice, index)  =>
      <tr key={`Key-$(index)`}>
        <td>1</td>
        <td>{offerPrice}</td>
      </tr>)
  )}
  </tbody>