反应问题将有效负载映射到带有子数组的表

时间:2019-01-30 12:51:40

标签: javascript reactjs

我正在获取有效负载,并尝试将数据映射到表。由于auditline数组,我在映射时遇到困难。     有谁知道拉平审核线的方式,以便我可以正确映射数据。

payload:
    action: 
     id: 301
     module : 2
     name: "Create folder"
     auditline:
     0: Id: 1723
        description:"Folder has been changed from Matlab to C#"
     1: Id: 1724
        description:"Folder name is Matlab"

这是地图功能代码段。

       <TableBody>
          {data.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map(n => {
            const isSelected = this.isSelected(n.id);
            return (
              <TableRow
                hover
                onClick={event => this.handleClick(event, n.id)}
                role="checkbox"
                aria-checked={isSelected}
                tabIndex={-1}
                key={n.id}
                selected={isSelected}
              >
                  <TableCell>{n.action.name}</TableCell>
                  <TableCell>{n.auditLines.description}</TableCell>
                <TableCell>
                </TableCell>
              </TableRow>
            );
          })}

1 个答案:

答案 0 :(得分:0)

您可以map进行一系列审计以创建多个表单元:

<TableRow
    hover
    onClick={event => this.handleClick(event, n.id)}
    role="checkbox"
    aria-checked={isSelected}
    tabIndex={-1}
    key={n.id}
    selected={isSelected}
    >
        <TableCell>{n.action.name}</TableCell>
        {n.auditLines.map(audit => <TableCell key={audit.id}>{audit.description}</TableCell>)}
    <TableCell>
    </TableCell>
</TableRow>

或者,如果您希望将它们全部合并在一起,请使用join