reactjs - 在 React 中动态创建表行

Question

我的要求是通过对数组对象的迭代来动态创建表行。我正在使用下面的代码来实现它：

details = _.forEach(executionDetails, function(value) {
        return (
          <TableRow>
            <TableCell> { value.numResults } </TableCell>
            <TableCell> { value.timeStamp } </TableCell>
          </TableRow>
        )
      })
  <Table>
   <TableBody>
       {details}
   </TableBody>
  </Table>

但这不起作用，我收到错误消息： Objects are not valid as a React child 。如果您打算渲染一组子项，请改用数组。提前致谢

标签： reactjs

Answer 1

forEach不返回任何内容，您需要使用 map 才能返回结果

details = executionDetails.map(function(value) {
    return (
      <TableRow>
        <TableCell> { value.numResults } </TableCell>
        <TableCell> { value.timeStamp } </TableCell>
      </TableRow>
    )
  })

<Table>
   <TableBody>
       {details}
   </TableBody>
</Table>