如何从fire store中获取多行并显示在数据表中--FLUTTER

Question

我在 firestore 上有一个名为“CASHOUT”的集合，其中包含字段 Random1、2 和 3。

我能够在数据表小部件中成功获取并显示

但是当我创建另一个具有相同字段的文档时

**它引发了我的错误

行.单元格.长度!=列.长度

**

我做错了什么？这是代码

            StreamBuilder(
              stream: _firestore.collection('CASHOUT').snapshots(),
              builder: (BuildContext context,
                  AsyncSnapshot<QuerySnapshot> snapshot) {
                if (snapshot.hasError) {
                  return const Text('Something went wrong');
                }

                if (snapshot.connectionState == ConnectionState.waiting) {
                  return const Text("Loading");
                }

                if (snapshot.hasData) {
                  List<DataCell> displayedDataCell = [];

                  for (var item in snapshot.data!.docs) {
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM1'].toString(),
                        ),
                      ),
                    );
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM2'].toString(),
                        ),
                      ),
                    );
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM3'].toString(),
                        ),
                      ),
                    );
                  }

                  return FittedBox(
                    child: DataTable(
                      columns: const <DataColumn>[
                        DataColumn(
                          label: Text(
                            'Date',
                          ),
                        ),
                        DataColumn(
                          label: Text(
                            'Amount',
                          ),
                        ),
                        DataColumn(
                          label: Text(
                            'Optional Detail',
                          ),
                        ),
                      ],
                      rows: <DataRow>[
                        DataRow(cells: displayedDataCell),
                      ],
                    ),
                  );
                }
                return const CircularProgressIndicator();
              },
            ),

Answer 1

您之所以收到此错误，是因为您要创建一个单元格中有 6 个项目的 DataRow，而必须创建 2 个包含 3 个单元格的 DataRow。

rows: <DataRow>[
  for (int i = 0; i < displayedDataCell.length; i += 3)
    DataRow(cells: [displayedDataCell[i], displayedDataCell[i + 1], displayedDataCell[i + 2]])
],

Answer 2

当您将数据添加到 displayedDataCell 时，您正在向表中添加不同的行和单个水平数据，从而导致此错误。

行中列出的数据数量必须与列的数量相匹配。
因此，无需创建数据单元格列表，只需为 DataTable 行中的每个数据添加一行，

首先获取数据

Map<String, dynamic> data = document.data() as Map<String, dynamic>;

，然后用此替换数据表行，然后它将自动更新

                  <DataRow>[
                        DataRow(
                          cells: <DataCell>[
                            DataCell(
                              Text(
                                item['RANDOM1'].toString(),
                              ),
                            ),
                            DataCell(
                              Text(
                                item['RANDOM2'].toString(),
                              ),
                            ),
                            DataCell(
                              Text(
                                item['RANDOM3'].toString(),
                              ),
                            ),
                          ],
                        ),
                      ],