javascript - 如何获取 Material UI DataGrid 的整体错误状态？

Question

我正在使用 Material UI DataGrid 组件来呈现 EXCEL 文件。每个 Excel 文件都有多个列名称并具有特定的类型。例如:

const columns = [
    {
        "field": "uwgroup",
        "headerName": "Group",
        "minWidth": 200,
        "editable": true
    },
    {
        "field": "Amazing column Name ",
        "flex": 1,
        "minWidth": 150,
        "editable": true
    },
    {
        "field": "Building TSI",
        "type": 'number',
        "flex": 1,
        "minWidth": 150,
        "editable": true
    },
    {
        "field": "dev",
        "flex": 1,
        "minWidth": 150,
        "editable": true
    }
]

栏目名称 Building TSI是 number 类型.我正在添加类名 invalid使用 cellClassName ， 就像是:

classnames({
   invalid: !isPositiveNumber(params.value)
})

它工作正常并呈现类名并指示错误单元格。问题是，我想计算错误单元格的总数。原因是，如果任何单元格中没有错误，我们只允许将网格值保存到数据库中。
解决方案，到目前为止我已经尝试过:

为 errorCount 添加状态并增加 errorCount当我添加类(class)时。这会导致多次重新渲染并超出内存限制。

我尝试使用 document.getElementByClassNames('invalid')并检查它的长度。它仅适用于渲染项目。也就是说，如果excel文件超过10行，则进行分页。无效单元格计数仅针对当前呈现的页面进行。

我尝试使用 preProcessEditCellProps指示错误的 Prop 。但是，我无论如何都找不到获得错误单元格的总数。只有一件事，我可以摆脱这个 Prop 是不允许用户输入错误值的能力。

我什至尝试使用 localStorage .它与解决方案 2 具有完全相同的问题。

如果有人遇到过类似的情况，我将不胜感激。获得总体错误单元格计数会很好，因此，我可以启用以禁用“保存”按钮。
我的限制之一是 excel 文件很大，平均包含 30-40k 行和 25-40 列。为每个单元格添加状态会变得性能降低。
提前致谢!

Answer 1

在列中拥有另一个属性并在为每个单元格/行导出之前引用它会有所帮助。
在此示例中，使用列定义和实际数据作为参数调用合格ForExport 函数将给出一个 bool 值，说明是否存在错误。也可以更改为计数错误。

const isInvalidBuildingTSI=(value)=>!isPositiveNumber(value);

const isPositiveNumber=(num)=>num>=0;

const eligibleForExport=(columns,data)=>{
    return !(data.find(row=>columns.find(column=>row[column.field] 
        && typeof column["isValid"] === "function" && column["isValid"](row[column.field]))))
}

const columns = [
    {
        "field": "uwgroup",
        "headerName": "Group",
        "minWidth": 200,
        "editable": true
    },
    {
        "field": "Building TSI",
        "type": 'number',
        "flex": 1,
        "minWidth": 150,
        "editable": true,
        "isValid" : isInvalidBuildingTSI,
        "cellClassName":isInvalidBuildingTSI(param.value)?"invalid":""
    }
];