You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
export default function MyComponent() {
//✅ GOOD
const columns = useMemo(() => [
// ...
], []);
//✅ GOOD (React Query provides stable references to data automatically)
const { data, isLoading } = useQuery({
//...
});
const table = useReactTable({
columns,
//❌ BAD: This will cause an infinite loop of re-renders because `data` is mutated in place (destroys stable reference)
data: data?.filter(d => d.isActive) ?? [],
});
return <table>...</table>;
Though it still cause infinite loop,
i find the statement is slightly incorrect since the .filter is not mutating the data,
in fact the data.filter is returning new array reference, not mutating it,
if it were mutated, it also wont change the array reference anway...
I think could have minor fix on that doc part
The text was updated successfully, but these errors were encountered:
in this link
https://tanstack.com/table/latest/docs/faq#pitfall-2-mutating-columns-or-data-in-place
Though it still cause infinite loop,
i find the statement is slightly incorrect since the .filter is not mutating the data,
in fact the data.filter is returning new array reference, not mutating it,
if it were mutated, it also wont change the array reference anway...
I think could have minor fix on that doc part
The text was updated successfully, but these errors were encountered: