When the table is loaded. I see warnings in browser console: Warning: Encountered two children with the same key, undefined. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.
When I remove isLoading in state of table. Browser console is not warning. I think animation skeleton of rows error.
const table = useMaterialReactTable({
columns,
data,
rowCount: data.length || 0,
getRowId: (row, index) => {
console.log('[row]', index)
return `${row?.id}` || `${index}`
},
// ref
rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,
// State
initialState: { density: 'compact', showGlobalFilter: true },
state: {
rowSelection,
density,
sorting,
showProgressBars: isFetching,
isLoading: isWindowLoading || isLoading,
})
material-react-table version
v2.0.4
react & react-dom versions
v18.2.0
Describe the bug and the steps to reproduce it
When the table is loaded. I see warnings in browser console: Warning: Encountered two children with the same key,
undefined. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.When I remove isLoading in state of table. Browser console is not warning. I think animation skeleton of rows error.
Minimal, Reproducible Example - (Optional, but Recommended)
Screenshots or Videos (Optional)
Do you intend to try to help solve this bug with your own PR?
None
Terms