Question

Map 内的 Map 值

2021-12-09

202

javascript reactjs dictionary

我尝试在数据数组中仅显示我需要用表格显示的名称键。

const data = [{id: "111", name: "Danny", city: "NYC"},
              {id: "222", name: "Roni", city: "LDN}, 
              {id: "333", name: "Suzi", city: "TLV",
              {id: "444", name: "John", city: "SF"}
             ]
const config = [{fieldToShow: "name"}]


  <tbody>
  {data.map((row) => {
    return (
      <tr>
        {config.map((value) => {
          return <td>{row[value.field]}</td>;
        })}
      </tr>
    );
  })}

但是它不起作用...

Answer 1

您的配置对象有一个键 fieldToShow :

const config = [{fieldToShow: "name"}]

当您尝试在地图中获取键 field 时。您将此行：

  return <td>{row[value.field]}</td>;

更改为：

  return <td>{row[value.fieldToShow]}</td>;

Answer 2

你可以这样做：

export default function Test() {
  const data = [
    { id: '111', name: 'Danny', city: 'NYC' },
    { id: '222', name: 'Roni', city: 'LDN' },
    { id: '333', name: 'Suzi', city: 'TLV' },
    { id: '444', name: 'John', city: 'SF' },
  ];
  const config = [{ fieldToShow: 'name' }];

  return (
    <tbody>
      {data.map((row) => (
        <tr>
          {data.map((row) => (
            <tr>
              {config.map((value) => (
                <td>{row[value.fieldToShow]}</td>
              ))}
            </tr>
          ))}
        </tr>
      ))}
    </tbody>
  );
}