Closed sasa5195 closed 6 years ago
The treeTable HOC is not meant to be able to use aggregation. It was built to demonstrate how the pivot table can be restyled. If you want aggregation as well then you'll have to implement that (however, it will probably be better just to use what is already there because there is no way to have the cells spaced out with the colSpans that would be necessary for it to work with aggregations. Its a "treeTable" not a "treeTableWithAggregation" - sorry.
What version of React-Table are you using?
Your bug may already be fixed in the latest release. Run
yarn upgrade react-table
! Place your version here... 6.7.6What bug are you experiencing, or what feature are you proposing?
Please include a detailed explanation here... I am using SELECT TREE TABLE (HOC) of the react-table library and tried to add the aggregate property in the columns list under the getColumns() function. But was not able to see the aggregate functionality working as expected in fact it just rendered the output as it was before. So can you please guide me whether the functionality of aggregation works with the Select Tree Table (HOC) ?
https://1vl3n1kmw4.codesandbox.io/
Please see the Highlighted piece of code.,
import React from 'react' import { render } from "react-dom" import Chance from 'chance'
import ReactTable from 'react-table' import 'react-table/react-table.css'
import selectTableHOC from 'react-table/lib/hoc/selectTable' import treeTableHOC from 'react-table/lib/hoc/treeTable'
const SelectTreeTable = selectTableHOC(treeTableHOC(ReactTable))
import testData from './test_data'
// const CheckboxTable = checkboxHOC(ReactTable);
const chance = new Chance();
function getData() { const data = testData.map((item) => { // using chancejs to generate guid // shortid is probably better but seems to have performance issues // on codesandbox.io const _id = chance.guid(); return { _id, ...item, } }) return data; }
const ignoreColumns = ['phone1','phone2','web','email','_id']; function getColumns(data) { const columns = []; const sample = data[0]; for (let key in sample) { if (ignoreColumns.includes(key)) continue; columns.push({ accessor: key, Header: key, aggregate: vals => vals + '', style: { whiteSpace: 'normal' }, }) } return columns; }
function getNodes(data, node = []) { data.forEach((item) => { if (item.hasOwnProperty('_subRows') && item._subRows) { node = getNodes(item._subRows, node); } else { node.push(item._original); } }); return node; }
The below image shows the pivoted values but doesnt give the values of other columns separated by comma
The below image is from the Pivoting and Aggregation example, Wanted to achieve this,