如何使用颤振将 TableRow 动态添加到表中答案

【问题标题】：How to add TableRow into Table dynamically with flutter如何使用颤振将 TableRow 动态添加到表中
【发布时间】：2020-01-17 08:00:52
【问题描述】：

我已经超过 3 天了。我想动态地将 TableRow 添加到 Table 中。但是我不知道如何从列表数据中添加 TableRows。

Table(
    columnWidths: {
      0: FlexColumnWidth(1.0),
      1: FlexColumnWidth(2.0),
    },
    border: TableBorder.all(),
    defaultVerticalAlignment: TableCellVerticalAlignment.middle,
    children: <TableRow>[
        // HOW CAN I MAKE ITERATION with List length.
    ]),

请告诉我怎么做。谢谢。

【问题讨论】：

标签： flutter dart

【解决方案1】：

预先在build 方法中创建列表。

final rows = <TableRow>[];
for (var rowData in myRowDataList) {
  rows.add(TableRow(
    ... // Generate a TableRow using rowData
  ));
}

...

Table(
  columnWidths: {
    0: FlexColumnWidth(1.0),
    1: FlexColumnWidth(2.0),
  },
  border: TableBorder.all(),
  defaultVerticalAlignment: TableCellVerticalAlignment.middle,
  children: rows,
),

或者，从 Dart 2.3 开始，您可以在列表声明本身中使用 for 循环。

Table(
  columnWidths: {
    0: FlexColumnWidth(1.0),
    1: FlexColumnWidth(2.0),
  },
  border: TableBorder.all(),
  defaultVerticalAlignment: TableCellVerticalAlignment.middle,
  children: [
    for (var rowData in myRowDataList)
      TableData(
        ... // Generate a TableRow using rowData
      ),
  ],
),

【讨论】：

我需要帮助，我正在尝试通过调用 API 动态添加 Row 元素。 [stackoverflow.com/questions/69132279/…]

【解决方案2】：

请在颤振飞镖中找到简单的循环表格

  Widget build(BuildContext context) {
  var list = [{'id':"123123","date":"20/08/2016"},{'id':"123124","date":"26/08/2016"},{'id':"123125","date":"26/08/2016"}]; 
  return Scaffold(
  appBar: AppBar(
  title: Text(widget.title),
  ),
  body: Center(
  child: Column(
  mainAxisAlignment: MainAxisAlignment.start,
  children: <Widget>[
    Text('Recent Claims'),
    Table(
      border: TableBorder.all(color: Colors.black),
      columnWidths: {
        0: FixedColumnWidth(100.0),
        1: FixedColumnWidth(100.0)
      },
      children:[
        for(var item in list )  TableRow(children: [
          Text(item['id']),
          Text(item['date']),
      ])]
       ),
  }

【讨论】：