Javascript 如何为react表添加标题

Javascript 如何为react表添加标题,javascript,reactjs,react-table,Javascript,Reactjs,React Table,我正在使用react表,需要将自定义标题添加到单个表中。我无法通过查看示例和文档来了解如何做到这一点。这是我的桌子目前的样子 这是我需要它的样子 这是我的表格配置 [ { Header: '', columns: [] }, { Header: '', columns: [] }, { Header: 'Avg Sales', columns: [] }, { Header: 'Project to

我正在使用react表,需要将自定义标题添加到单个表中。我无法通过查看示例和文档来了解如何做到这一点。这是我的桌子目前的样子

这是我需要它的样子

这是我的表格配置

    [
  {
    Header: '',
    columns: []
  },
  {
    Header: '',
    columns: []
  },
  {
    Header: 'Avg Sales',
    columns: []
  },
  {
    Header: 'Project to Date',
    columns: []
  },
  {
    Header: '',
    columns: [
      {
        Header: '',
        accessor: 'spacer',
        width: 35
      }
    ]
  },
  {
    Header: 'Activity & Inventory',
    columns: []
  },
  {
    Header: '',
    columns: [
      {
        Header: '',
        accessor: 'spacer',
        width: 35
      }
    ]
  },
  {
    Header: 'Additional Data Entered',
    columns: []
  }
]

似乎在列中,每个对象都可以有一个字段头和一个字段列,该字段列具有一个数组,其中包含具有相同结构的对象。因此,在您的情况下,您需要这样的东西,所以您需要的只是拆分对象,如:

[{
  Header: 'Title 1',
  columns: [...], //subgroup 1
 },
 {
  Header: 'Title 2',
  columns: [...], //subgroup 2
 },
]
如果它不能解决您的问题,您可以单独添加元素,然后使用CSS进行调整