如何在react-table.js中更改聚合计算

时间:2019-05-29 12:48:33

标签: javascript reactjs react-table

我正在尝试从react-table中获得适当的平均聚合。目前,当您对聚合进行平均时,它将对子行进行平均。如果只有1个聚合级别,则没有问题。如果您有多个级别,则会带来问题。它计算子行平均值的平均值。这是不正确的。

我尝试以不同的方式聚合它,但是我不知道从何处获取所有聚合中所有子行的值。

const data = [
  {
    region: "South",
    country: "Spain",
    item: "item1",
    item_type: "type1",
    value: 140
  },
  {
    region: "South",
    country: "Spain",
    item: "item2",
    item_type: "type2",
    value: 240
  },
  {
    region: "South",
    country: "Spain",
    item: "item3",
    item_type: "type1",
    value: 140
  },
  {
    region: "South",
    country: "Spain",
    item: "item4",
    item_type: "type2",
    value: 240
  },
  {
    region: "South",
    country: "France",
    item: "item5",
    item_type: "type1",
    value: 140
  },
  {
    region: "South",
    country: "France",
    item: "item6",
    item_type: "type2",
    value: 240
  },
  {
    region: "North",
    country: "UK",
    item: "item7",
    item_type: "type1",
    value: 140
  },
  {
    region: "North",
    country: "UK",
    item: "item8",
    item_type: "type1",
    value: 240
  },
  {
    region: "North",
    country: "UK",
    item: "item9",
    item_type: "type1",
    value: 10
  },
  {
    region: "North",
    country: "UK",
    item: "item10",
    item_type: "type2",
    value: 30
  },
  {
    region: "North",
    country: "UK",
    item: "item11",
    item_type: "type2",
    value: 450
  }
];

这些是我的专栏:

const columns = [
        {
          Header: "region",
          accessor: "region"
        },
        {
          Header: "country",
          accessor: "country"
        },
        {
          Header: "item",
          accessor: "item"
        },

        {
          Header: "item_type",
          accessor: "item_type"
        },
        {
          Header: "value",
          accessor: "value"
        }
      ];

这是我的组件:

<ReactTable data={data} columns={columns} pivotBy={["region", "country", "item_type"]} />

在该示例中,西班牙的平均值为145,法国的平均值为505。如果对所有行进行平均值计算,则得到265。但是,在表中,它的确是法国的平均值和西班牙,则为145 + 505 /2。这是不正确的。应该是1590/6。

1 个答案:

答案 0 :(得分:0)

我也遇到了这个问题,还没有找到在反应表中包含内置聚合流的解决方案。最终分开进行汇总,然后在react-table中显示汇总的数据。