从 Firestore 获取到 SfDataGrid

Answer 1

这对我有用， 这是基于 Syncfusion 网站上的一个示例： https://www.syncfusion.com/kb/12766/how-to-load-data-from-firebase-to-flutter-datatable-sfdatagrid 此示例使用实时数据库，但您只需要填写正确的代码即可使其适用于 firestore，因此无需：

  getDataFromDatabase() async {
    var value = FirebaseDatabase.instance.reference();
    var getValue = await value.child('DataGridEmployeeCollection').once();
    return getValue;
  }

你初始化：

 FirebaseFirestore db = FirebaseFirestore.instance;
  Stream<QuerySnapshot> _userStream =
  FirebaseFirestore.instance.collection('Users').snapshots();

我使用流是因为我希望我的数据实时更新。 然后按照示例进行操作，它应该如下所示：

用户数据来源：

class UserDataSource extends DataGridSource {
  UserDataSource(this._currentUserInfo) {
    _buildDataRow();
  }

  List<DataGridRow> users = [];
  List<CurrentUserInfo> _currentUserInfo;

  void _buildDataRow() {
    users = _currentUserInfo
        .map<DataGridRow>((e) => DataGridRow(
              cells: [
                DataGridCell<String>(
                  columnName: "Uid",
                  value: e.Uid,
                ),
                DataGridCell<String>(
                  columnName: "Name",
                  value: e.Name,
                ),
                DataGridCell(
                  columnName: "Surname",
                  value: e.Surname,
                ),
                DataGridCell(
                  columnName: "Role",
                  value: e.UserRole,
                ),
                DataGridCell(
                  columnName: "City",
                  value: e.City,
                ),
              ],
            ))
        .toList();
  }

  @override
  List<DataGridRow> get rows => users;

  @override
  DataGridRowAdapter buildRow(
    DataGridRow row,
  ) {
    return DataGridRowAdapter(
        cells: row.getCells().map<Widget>((e) {
      return Container(
        alignment: Alignment.center,
        padding: EdgeInsets.all(8.0),
        child: Text(e.value.toString()),
      );
    }).toList());
  }
}

class _UserIndexState extends State<UserIndex> {
  @override
  late UserDataSource userDataSource;
  late List<CurrentUserInfo> UserData = [];
  FirebaseFirestore db = FirebaseFirestore.instance;
  Stream<QuerySnapshot> _userStream =
      FirebaseFirestore.instance.collection('Users').snapshots();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return BaseWidget(child: Center(
      child: StreamBuilder<QuerySnapshot>(
        stream: _userStream,
        builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
          if (!snapshot.hasData) return LinearProgressIndicator();
          UserData.clear();
          snapshot.data!.docs.forEach((doc) {
            UserData.add(
                CurrentUserInfo.fromJson(doc.data() as Map<String, dynamic>));
          });

          userDataSource = UserDataSource(UserData);
          return SfDataGrid(
            columnWidthMode: ColumnWidthMode.fill,
            source: userDataSource,
            columns: <GridColumn>[
              GridColumn(
                columnName: "Uid",
                label: Container(
                  padding: EdgeInsets.all(16.0),
                  alignment: Alignment.center,
                  child: Text(
                    'ID',
                  ),
                ),
              ),
              //make gridcollumns for Name Surname role and city
              GridColumn(
                columnName: "Name",
                label: Container(
                  padding: EdgeInsets.all(16.0),
                  alignment: Alignment.center,
                  child: Text(
                    'Name',
                  ),
                ),
              ),
              GridColumn(
                columnName: "Surname",
                label: Container(
                  padding: EdgeInsets.all(16.0),
                  alignment: Alignment.center,
                  child: Text(
                    'Surname',
                  ),
                ),
              ),
              GridColumn(
                columnName: "Role",
                label: Container(
                  padding: EdgeInsets.all(16.0),
                  alignment: Alignment.center,
                  child: Text(
                    'Role',
                  ),
                ),
              ),
              GridColumn(
                columnName: "City",
                label: Container(
                  padding: EdgeInsets.all(16.0),
                  alignment: Alignment.center,
                  child: Text(
                    'City',
                  ),
                ),
              ),
            ],
          );
        },
      ),
    ),);
  }
}