Material-UI DataGrid：从状态中删除一行导致无法读取属性错误

Question

1. 我有一个材质 UI Datagrid 如下：

<DataGrid
                            className={classes.datagrid}
                            page={page}
                            pageSize={rowsPerPage}
                            rows={rows}
                            columns={columns}
                            sortModel={sortModel}
                            rowCount={meta.total}
                            loading={store.panels.loading}
                            rowsPerPageOptions={
                                [5, 10, 25, 50] as PageSizeOptions[]
                            }
                            disableSelectionOnClick
                            onPageSizeChange={changePageSize}
                            autoHeight
                            onPageChange={handlePageChange}
                            onSortModelChange={updateSort}
                            components={{
                                loadingOverlay: LoadingOverlay,
                                noRowsOverlay: NoRowOverlay,
                            }}
                        />

1. 我有一个可观察的 mobx 数组。 const rows = [从全局存储继承的 mobx 数组]
2. 然后我从全局存储的数组中删除一行。
3. 我收到以下错误：

TypeError: Cannot read property 'id' of undefined
(anonymous function)
node_modules/@material-ui/data-grid/dist/index-esm.js:15
etc...

mobx 数组是一个对象数组 [ { id: 1, name: "bob" }, etc...]

列：

const columns: ColDef[] = [
        { field: 'id', hide: true },
        {
            headerName: 'Name',
            field: 'name',
            width: 110,
        },
    ];

仅当我尝试删除一行时才会出现此错误。 添加、获取或更新工作正常。

这似乎是 MUI DataGrid 的一个错误 https://material-ui.com/components/data-grid/rows/

告诉我。

问候， 埃米尔

Answer 1

该修复程序已在 v4.0.0-alpha.10 中发布。 参考：https://github.com/mui-org/material-ui-x/issues/571

Answer 2

这确实是 DataGrid 的错误。您需要将库降级到版本：4.0.0-alpha.8 或将其设置为“https://pkg.csb.dev/mui-org/material-ui-x/commit/02423225/@material-ui/data -网格”