Question

似乎无法弄清楚如何将我的阵列分成不同的行而不是全部出现在同一个单元格中。我有这样的数据结构：

[{Env: "DEV", Members: [John Doe, Jane Smith]}, {Env: "TEST", Members: [Joe Black, Sarah Niu]}]

我在主表上显示Env，其中成员显示为子组件。但是，成员显示在同一单元格中。有没有办法让它们显示在不同的行中，还是我需要列出它们？例如[{Env：DEV，成员：John Doe，环境：DEV，成员：Jane Smith}]目前的代码如下：

return (
    <div>
      <ReactTable
         data={this.props.data}
         columns={envColumn}
         className="-striped -highlight"
         defaultPageSize={10}
         SubComponent={row => 
           return (
              <ReactTable
                data={[row.original]}
                columns={memberColumn}
                defaultPageSize={3}
                showPagination={false}
               />
            )
         }}
       />
     </div>
 )

非常感谢任何帮助。

Answer 1

使用数据函数解决：

separateMembers(members) {
        var array = []
        members.forEach((item) => {
            array.push({ Member: item })
        })
        return array;
}

将多个单元格值分隔为行

1 个答案: