TanStack

T

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

flat-fuchsia
flat-fuchsia12/20/2022

is the use of columnHelper mandatory?

I am thinking of migrating my project from using v7 to v8, and saw that in the column defs section in the docs you mentioned the use of a columnHelper instance to create the different types of columns, but you didn't use it in the react examples. so my question is - if I migrate to v8, will my existing tables work or will I have to rewrite all of them?...
old-apricot
old-apricot12/19/2022

Table keeps re-rendering... (getRowModel)

Guys, i am so desperate right now i need your help. I have a react table that just keeps re-rendering forever and I can't find the reason. The only thing i suspect is that table.getRowModel() causes the re-render because if i comment out the entire <tbody> element, the re-rendering stops. ...
rising-crimson
rising-crimson12/19/2022

Find out if column is accessor or display?

Hello is there any way to find out if some column is accessor or display in column definition?
No description
robust-apricot
robust-apricot12/18/2022

Client-side exception on NextJS deployment

I have a Tanstack table that works perfectly in dev, but fails in prod. I get this error: ``` framework-3b5a00d5d7e8d93b.js:9 TypeError: Cannot read properties of undefined (reading 'filter') at 338-40b21a5eb2cada72.js:42:10338 at Object.getVisibleLeafColumns (338-40b21a5eb2cada72.js:39:249)...
adverse-sapphire
adverse-sapphire12/15/2022

onChange of value in dropdown in cell, rerenders the complete table.

What I am doing 1. Loading dropdown in cell 2.onChange of value in dropdown I am setting one state in zustand store ```js // all columns ...
fair-rose
fair-rose12/15/2022

Pass a readonly array as data

I want to pass a readonly array to the data of react-table, but it will not take it without ts-ignore. The array comes from a react-query useQuery hook, so it makes sense to me that it should be readonly....
rare-sapphire
rare-sapphire12/14/2022

aggregationFn

Hi someone can help me to create a custom aggregate function in react table.
ratty-blush
ratty-blush12/14/2022

Accessing data in nested objects

Hi, I have a data array with an object instead of primitive. How can I access this data to display in the table? v8 react-table ```js const data = [ colName1: {value: 'foo'}, colName2: {value: 'bar'}...
fascinating-indigo
fascinating-indigo12/14/2022

How to properly separate table files?

When you separate files naively, every table update causes any other component inside it to rerender. https://codesandbox.io/s/tanstack-table-file-separation-resize-mtm19c Here is an example where I've separated the header and rows to another component. I've tried some ways to memoize it but I could not get it to work properly, it would either stop the width updates or still continue to rerender. Is there a good example on how to properly pass those big objects as props, such as headerGroup or row?...
yappiest-sapphire
yappiest-sapphire12/14/2022

Am I using columnHelper correctly?

When I try to use columnHelper, I am getting a typescript error Expected 2 arguments, but got 1. That said, the code compiles and the page loads.
No description
multiple-amethyst
multiple-amethyst12/13/2022

Reset expanded rows on data changed

I'm trying to enable resetting expanded rows when data provided to table options has changed. I have manual pagination, and just update the data prop with items from current page. I tried setting autoResetExpanded to true which is actually it's default value, but it didn't work....
rising-crimson
rising-crimson12/12/2022

Force reorder of a column to it's current or default order

column.toggleSort allows you to specify desc: boolean, to set the direction to ascending or descending. Is there any way to trigger a re-order to default order for the column? Removing the sort state won't work in my case as the column is really sorted manually based on the values of a sibling column. As far as the library is concerned, it's not even sorted to begin with (it's the sibling column which is sorted).
harsh-harlequin
harsh-harlequin12/12/2022

esbuild support?

I am using Creat React App with Craco and CracoEsbuildPlugin for my app, after install React Table the app couldn't build because current loader couldn't handle the file.
No description
rising-crimson
rising-crimson12/12/2022

Server side pagination and sorting

Does anybody have an example of the react table with typescript which works with server side pagination, sorting and filtering? also i would like to know how to implement row selection with that server side pagination? do i need a state with selected row or checking the checkboxes per page can handle a react-table? thank you for all the answers 🙂...
extended-salmon
extended-salmon12/9/2022

Async table row

Hi guys. basically what I want to achieve here is: I want to fetch each row on parallel async. I couldn't find way to add/trigger fetch on each row....
No description
stormy-gold
stormy-gold12/6/2022

updateData in editable-data example (V8 help)

does anyone understand the updateData function in the editable-data example? Is this actually updating my data array? When I log to console it comes up as a blank array. I'm using the context API to bring in data for the table. It renders fine, but the updateData function doesn't seem to do anything. Am I just looking at this incorrectly?
jolly-crimson
jolly-crimson12/6/2022

How to get custom props in v8 (like getHeaderProps & getCellProps in v7)

Previously, I'd be able to add custom props to a column definition like so: ``` id: 'column-id', Header: ({ column }) => {...
fascinating-indigo
fascinating-indigo12/6/2022

How to get center rows height?

Hello, I want to get center rows height for my left/right rows. Any ideas how to do that?
No description
flat-fuchsia
flat-fuchsia12/5/2022

How to make nested row grouping using react-table please help

I want to create a nested grouped row in react-table can any one help.
fascinating-indigo
fascinating-indigo12/4/2022

How to get the data for a specific column

I want to fetch all the data that's present in a specific column