首页 > 解决方案 > 如何从 Firebase 获取数据快照并将其放入同一项目的单独 dart 文件中?

问题描述

我的团队最初被要求为一个名为“Smart Gloves”的 Flutter 应用程序创建一个原型。现在稍后,我们被分配使用 Firebase 作为我们的后端服务器,从中获取数据并像我们在应用原型中所做的那样显示它。但是,我无法从数据库中成功获取任何内容。

原型1参考在底部给出

这是原型的代码

edu_module.dart

const List<EduModule> eduModules = [
  EduModule(
    title: 'Interrupted Stitch',
    subtitle: 'subt lorem ipsum',
    learnModule: LearnModule(
        video: null,
        graph:
            'https://google.github.io/charts/flutter/example/scatter_plot_charts/shapes_full.png',
        techniques: [
          'Some key technique here.',
          'Another key technique here.',
          'Final consideration here.'
        ]),
    practiceModule: PracticeModule(
        instructions: 'inst lorem ipsum',
        video: null,
        graph:
            'https://google.github.io/charts/flutter/example/line_charts/segments_full.png',
        dummyResult: PracticeResult()),
    challenge: ChallengeModule(),
  )

edu_module_screen.dart

class EduModuleScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Education Library'),
      ),
     body: SafeArea(
        child: ListView.builder(
          itemCount: eduModules.length,
          itemBuilder: (BuildContext context, int index) =>
              EduModuleTile(eduModules[index]),
        ),
      ),
    );
  }
}

这是我在 edu_module.dart 中的当前代码

import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart'; // Importing cloud firestore package to link this with Firebase


class eduModule extends StatefulWidget {
  FirebaseFirestore firestore = FirebaseFirestore.instance;

  @override
  _eduModuleState createState() => _eduModuleState();
}

class _eduModuleState extends State<eduModule> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: Text('Education Library'),
          ),
          body: Center(
            child: StreamBuilder(
                stream: FirebaseFirestore.instance
                    .collection('Education')
                    .snapshots(),
                builder: (context, AsyncSnapshot snapshot) {
                  if (!snapshot.hasData) {
                    return Text('Error 404! Not Found');
                  }
                  return ListView.builder(
                    itemCount: snapshot.data.docs.length,
                    itemBuilder: (context, index) {
                      DocumentSnapshot result = snapshot.data.docs[index];
                      return Card(
                        child: ListTile(
                            title: Text(result['name'].toString())
                        ),
                      );
                    },
                  );
                }
            ),
          ),
        )
    );
  }
}

原型 Firebase

标签: firebaseflutterdartfetchsnapshot

解决方案


推荐阅读