Flutter DataTable如何获取所有行数据以保存表格修改内容

实现方案说明 #

你直接通过GlobalKey调用table1.rows()的方式无法获取编辑后的数据，原因是DataTable的rows属性仅为初始化传入的静态配置，用户的编辑操作不会同步回Widget的属性值。推荐优先使用数据驱动的方案实现需求，以下是两种可落地的实现方式：

方案1：数据驱动实现（推荐） #

Flutter开发中优先通过数据源维护动态修改内容，不需要读取Widget属性就能拿到全量修改数据：

1. 先改造你的数据源类，将aaaa、bbbb字段改为可修改属性，或新增拷贝修改方法
2. 把DataCell内的只读Text改为可编辑组件，编辑时实时同步到数据源：

cells: [
  DataCell(
    TextFormField(
      initialValue: data.aaaa,
      onChanged: (value) {
        // 找到当前条目的索引，修改对应数据源
        final index = provider.data.results.indexOf(data);
        provider.data.results[index].aaaa = value;
      },
    )
  ),
  DataCell(
    TextFormField(
      initialValue: data.bbbb,
      onChanged: (value) {
        final index = provider.data.results.indexOf(data);
        provider.data.results[index].bbbb = value;
      },
    )
  ),
]

3. 提交按钮直接读取已经同步了所有修改的数据源即可：

onPressed: () {
  // 直接获取全量修改后的表格数据
  final allTableData = provider.data.results;
  for (var rowData in allTableData) {
    print('AAAA列值：${rowData.aaaa}，BBBB列值：${rowData.bbbb}');
  }
  // 后续执行提交到服务端/本地存储逻辑
},

方案2：通过GlobalKey读取Widget内容（不推荐） #

如果确实需要直接读取DataTable组件的当前内容，可以按以下方式实现，注意如果表格存在分页、滚动、排序逻辑，不可见的行可能被组件回收，无法拿到完整数据：

1. 定义Key时指定明确类型：

final GlobalKey<DataTableState> table1 = GlobalKey<DataTableState>();

2. 提交按钮遍历读取所有单元格内容：

onPressed: () {
  final tableState = table1.currentState;
  if (tableState == null) return;
  // 读取所有行配置
  final allRows = tableState.widget.rows;
  for (var i = 0; i < allRows.length; i++) {
    final row = allRows[i];
    // 读取对应单元格的组件值，需要和你DataCell内的组件类型对应
    final aaaaValue = (row.cells[0].child as TextFormField).controller?.text ?? '';
    final bbbbValue = (row.cells[1].child as TextFormField).controller?.text ?? '';
    print('第${i+1}行：AAAA=$aaaaValue，BBBB=$bbbbValue');
  }
},

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