单元格自定义

可以在列定义中(ColumnDef)中自定义单元格的显示格式. 如:

const columns: ColumnDef<Person>[] = [
  // ...others column def
  {
    // ...others def
    header: (cx) => <span className="text-secondary">整数</span>,
    cell: (cx) => formatNumber(cx.getValue(), "integer"),
    footer: (cx) => <span className="text-secondary">整数</span>,
  },
];

注意: 一旦自定义了单元格组件, 列定义中的meta.align将不再起作用. 你需要在你的单元格组件中自己设置对齐方式.

下面的例子中, 年龄大于30岁的显示红色; 存款列自定义表头样式, 数据单元格采用千分位格式, 同时在表脚显示汇总统计.

个人信息
ID
姓名
性别
年龄
存款
无数据
总人数:0
男女比例:NaN
平均年龄: NaN
总计:0.00