When editing a cell, if the data updates so that column no longer exists but the editor is still active, an error is thrown and the component crashes.
TypeError: Cannot read properties of undefined (reading 'colSpan')
Link to code example: https://codesandbox.io/s/suspicious-platform-gf1irg (start editing the "Name" column before the 5s timer to reproduce)
Code in case the link expires:
import { useReducer, useEffect } from "react";
import DataGrid, { textEditor } from "react-data-grid";
import "react-data-grid/lib/styles.css";
const columns = [
{ key: "id", name: "ID" },
{ key: "name", name: "Name", editor: textEditor }
];
const rows = [{ id: "1", name: "John" }];
export default function App() {
const [showNameColumn, toggleNameColumn] = useReducer((x) => !x, true);
useEffect(() => {
const timeout = setTimeout(toggleNameColumn, 5000);
return () => clearTimeout(timeout);
}, [showNameColumn]);
return (
<DataGrid
columns={showNameColumn ? columns : columns.slice(0, 1)}
rows={rows}
/>
);
}
The selection should be cleared and it should not crash.
react-data-grid
version: 18.0.0react
/react-dom
version: 7.0.0-beta.22Owner Name | adazzle |
Repo Name | react-data-grid |
Full Name | adazzle/react-data-grid |
Language | TypeScript |
Created Date | 2015-03-06 |
Updated Date | 2023-03-23 |
Star Count | 5922 |
Watcher Count | 129 |
Fork Count | 2072 |
Issue Count | 161 |
Issue Title | Created Date | Updated Date |
---|