首页 > 解决方案 > Flutter 和 Firebase:在小部件中显示来自 cloud_firestore 的存储信息

问题描述

如图所示,我想显示来自我的 firebase cloudfirestore 的数据:

在此处输入图像描述

在设置页面中,我想显示登录用户的所有信息。这是设置代码(德语中的“einstellungen”):

class einstellungen extends StatelessWidget {
  final user = FirebaseAuth.instance.currentUser;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.red,
        title: Text("Einstellungen"),
      ),
      backgroundColor: Colors.orange,
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
                margin: const EdgeInsets.only(
                    left: 8.0, right: 8.0, top: 10.0, bottom: 5.0),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  color: Colors.white.withOpacity(0.2),
                ),
                child: Column(
                  children: [
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text('Benutzer:',
                            style: TextStyle(fontWeight: FontWeight.bold)),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.only(
                            bottom: 10.0, left: 10.0, right: 10.0),
                        child: Text(''),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text('Spitzname:',
                            style: TextStyle(fontWeight: FontWeight.bold)),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.only(
                            bottom: 10.0, left: 10.0, right: 10.0),
                        child: Text(''),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text('E-Mail:',
                            style: TextStyle(fontWeight: FontWeight.bold)),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.only(
                            bottom: 10.0, left: 10.0, right: 10.0),
                        child: Text(''), // here should print the email address from firestore
                      ),
                    ),
                    Text(''),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text('Hinweis: ',
                            style: TextStyle(fontWeight: FontWeight.bold)),
                      ),
                    ),
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text(
                            'Wenn Du dein Konto löschen oder dein Passwort zurücksetzen möchtest, schreibe bitte eine Email an medien@visuhome.de'),
                      ),
                    ),
                    Text(''),
                  ],
                )),
            Container(
              margin: const EdgeInsets.only(
                  left: 8.0, right: 8.0, top: 3.0, bottom: 3.0),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(20),
                color: Colors.white.withOpacity(0.2),
              ),
              child: Row(
                children: [
                  ButtonNutzung(),
                  Text("Nutzungsbedingungen",
                      style:
                          TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                ],
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(10.0),
              child: Divider(),
            ),
            SizedBox(height: 10),
            if (user.uid != null)
              Text(
                'Cloud User-ID: ' + user.uid,
                style: TextStyle(color: Colors.black),
              ),
            SizedBox(height: 10),
            Padding(
              padding: const EdgeInsets.all(10.0),
              child: Divider(),
            ),
            GestureDetector(
              onTap: _launchURL2,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Padding(
                    padding: const EdgeInsets.only(left: 20.0, right: 20.0),
                    child: Text(
                      'created by visuhome',
                      style: TextStyle(
                          fontWeight: FontWeight.w300,
                          fontSize: 12,
                          color: Colors.black),
                    ),
                  ),
                  Image(
                    //AssetImage oder SizedBox mit child und width
                    image: AssetImage('assets/visuhome_logo_black_flutter.png'),
                    fit: BoxFit.fitHeight,
                    height: 30,
                  ),
                  Padding(
                    padding: const EdgeInsets.only(left: 20.0, right: 20.0),
                    child: Text(
                      'Version 1.0',
                      style: TextStyle(
                          fontWeight: FontWeight.w300,
                          fontSize: 12,
                          color: Colors.black),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

如您所见,我确实从 获取信息FirebaseAuth.instance.currentUser,因此显示了userid来自登录用户的信息。但我也想要来自 firestore 中用户数据的信息。

我猜有人可以帮忙解决这个基本的firestore技巧吗?我是新来的。尝试了很多,但找不到适合我的例子的解决方案。非常感谢

标签: firebaseflutterdartgoogle-cloud-firestore

解决方案


您应该创建对 Firestore 的查询并获取用户详细信息。

如果您知道用户 ID,则可以调用doc函数来创建查询。

 @override
  Widget build(BuildContext context) {
    CollectionReference users = FirebaseFirestore.instance.collection('users');

    return FutureBuilder<DocumentSnapshot>(
      future: users.doc(documentId).get(),
      builder:
          (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot) {

        if (snapshot.hasError) {
          return Text("Something went wrong");
        }

        if (snapshot.connectionState == ConnectionState.done) {
          Map<String, dynamic> data = snapshot.data.data();
          return Text("Full Name: ${data['full_name']} ${data['last_name']}");
        }

        return Text("loading");
      },
    );
  }

或使用 where 表达式通过其属性(例如电子邮件)查找用户:

FirebaseFirestore.instance
  .collection('users')
  .where('email', isEqualTo: "test@yahoo.de")
  .get()

有关更多详细信息,请查看 Firestore教程


推荐阅读