小编Rig*_*igs的帖子

我正在使用 react-table 来显示一些行，每一行都有一个子组件，它只是呈现更多的“子行”。但是，您必须单击该行才能显示子行。React-table 没有默认扩展的设置。有一些关于这样做的讨论，但我似乎无法用我的例子做任何事情。

Current 在加载时看起来像这样：

单击每一行后（我如何尝试让它看起来默认）

表.js

import React, { Component } from 'react';
import ReactTable from 'react-table';
import { columns, subComponent } from './tableSetup';


class Table extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <ReactTable data={ data }
        columns={ columns }
        SubComponent={ subComponent }
        expandedRows={ true }
        resizable={ false }
        minRows={ 1 }
        pageSize={ 8 }
        showPageSizeOptions={ false } />
    );
  }
}

export default Table;

tableSetup.js 与示例数据从“反应”导入反应；

export const columns = [
  {
    Header: …

我有一个看起来像的对象：

var data = {first: '12/1/2019', second: '12/15/2019'}

我正在尝试使用其键和值进入对象数组，如下所示：

var array = [ 
  {phase: 'first', date: '12/1/2019'}, 
  {phase: 'second', date: '12/15/2019'}
]

我尝试了各种方法，但是最接近的方法是：

var array = Object.entries(data).map(([key, value]) => ({key,value}));

这给了我一系列对象，例如：

[ 
 {key: 'first', value: '12/1/2019'},
 {key: 'second', value: '12/15/2019'}
]

快到了！但我不知道如何将键和值更改为阶段和日期。有人可以帮我吗？