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

Posted 2023-02-21

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

【英文标题】：Material-UI DataGrid: Removing a row from state causes Cannot read property error

【发布时间】：2021-03-02 21:11:39

【问题描述】：

我有一个材质 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,
                            
                        />

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

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/

告诉我。

问候， 埃米尔

【问题讨论】：

使用 react-hook-form 库中的 useFieldArray 时遇到同样的问题。有人可以帮忙吗？

【参考方案1】：

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

【参考方案2】：

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

【讨论】：

我整天都在处理这个问题。看到你说这是一个错误，我感到非常耳目一新。但是，你怎么知道这是一个错误。你能在他们的 GutHub 页面上提供一个问题的链接吗？

此外，将库降级到 4.0.0-alpha.8 仍然不能解决我的问题。

我刚刚提交了这个错误报告：github.com/mui-org/material-ui-x/issues/607 还有其他的吗？

给你：github.com/mui-org/material-ui-x/issues/571