物料表如何汇总行？ reactjs

Question

如何处理材料表中的摘要行 帮帮我，谢谢

Answer 1

如果通过“摘要行”指的是表标题，那么这就是仅添加到<MaterialTable />组件中的道具“标题”。

但是，我怀疑您需要带有Total结果的行，这在examples中也找不到。 这是一个自定义函数，您可以使用该函数自己计算总数，将其添加到数据集中并获得相似的结果：

const addTotal = (data, byColumn) => {
  let keys = Object.keys(data[0]);
  let total = data.reduce((acc, el) => {
    return acc += +(el[byColumn]);
  }, 0);

  let totalRow = {};
  let emptyRow = {};
  for (let key of keys) {
    if (key === keys[0]) {
      totalRow[key] = 'Total';
    } else if (key === byColumn) {
      totalRow[key] = total;
    } else {
      totalRow[key] = '';
    }
    emptyRow[key] = '';
  }
  return [...data, emptyRow, totalRow];
}

这将添加一个空行和一个总计，并将您输入的参数设为byColumn。您需要注意要求和的值（即添加类型检查或使用hasOwnProperty验证列名）。