如何從fire store中獲取多行並顯示在數據表中--FLUTTER

Question

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

我能夠在 Data.table 小部件中成功獲取和顯示

但是當我創建另一個具有相同字段的文檔時

**它給我一個錯誤

rows.cells.length.= columns.length

**

我做錯了什么？？ 這是代碼

            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>;

然后用這個替換你的行 data.table 然后它會自動更新

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