MUI Datatable如何按选中行过滤数据以执行数组reduce计算

MUI Datatable 没有默认给原始行数据添加选中标识，你可以根据你的实现方式选以下两种过滤逻辑：

方式1：自定义维护行选中状态 #

如果你已经通过onRowSelectionChange事件给每一行数据添加了自定义的选中标识（比如字段名为isSelected），直接按该字段过滤即可：

yourDataArray.filter(row => row.isSelected).reduce(/* 你的reduce逻辑 */)

方式2：基于官方暴露的选中索引过滤（更常用） #

MUI Datatable 会通过onRowSelectionChange事件返回所有选中行在原始数据数组中的索引，你可以先把这部分索引存在state里（比如变量名为selectedRowIndices），再通过索引匹配过滤选中行：

yourDataArray.filter((row, index) => selectedRowIndices.includes(index)).reduce(/* 你的reduce逻辑 */)

注意事项 #

• 如果开启了表格的分页、排序、筛选功能，selectedRowIndices默认返回的是全量原始数据的索引，符合全量统计的需求；如果需要只统计当前页选中行，需要额外结合当前页参数做索引映射。
• 不要用== true做判等，直接判断布尔值可以避免隐式类型转换带来的异常问题。

内容的提问来源于stack exchange，提问作者Aymen Aymen