How to show and hide some columns on React Table?
In column there is a property show
.show: true, // can be used to hide a column
.
Make it false to hide the particular column. Keep user's check-box values in the state. https://react-table.js.org/#/story/readme
Note: The column property show
is deprecated. Use initialstate.hiddenColumns
instead.
Check: https://github.com/tannerlinsley/react-table/issues/1804
code exmaple:
const columns = useMemo( () => [ { Header: 'DeviceId', accessor: 'DeviceId', }, { Header: 'Serial_Number', accessor: 'Serial_Number', }, { Header: 'Type', accessor: 'Type', }, ], [] );const initialState = { hiddenColumns: ['DeviceId'] };useTable({ columns, data, initialState }, useSortBy )