首页 > 解决方案 > 如何从小部件中的 firestore 检索数据?

问题描述

在我的用户集合中,存储了 photoURL、name 等字段。我想在我的小部件中显示这些字段。

这是我获取当前用户的代码。

  Future<void> _getUserDoc() async {
    final FirebaseAuth _auth = FirebaseAuth.instance;
    final Firestore _firestore = Firestore.instance;

    FirebaseUser user = await _auth.currentUser();
    setState(() {
      userRef = _firestore.collection('users').document(user.uid);
    });
  }

我不知道如何获取数据字段。这是我的名称小部件。

                  Padding(
                    padding:
                        const EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0),
                    child: Text(
                      'Richie',
                      style: TextStyle(
                          fontFamily: 'Montserrat',
                          fontWeight: FontWeight.bold,
                          fontSize: 17.0),
                    ),
                  ),

我想在文本小部件中显示来自 firestore 的用户名而不是Richie 。

提前致谢。

标签: dartfluttergoogle-cloud-firestore

解决方案


您可以FutureBuilder用于显示用户名,但也需要获取当前用户,因此如果您没有在其他地方获取当前用户,则可以使用嵌套FutureBuilders

connectionState您可以使用属性检查该未来的当前状态,并CircularProgressIndicator() 在 connectionState 等待时显示;

Widget DisplayUserName() {
  return FutureBuilder(
    future: FirebaseAuth.instance.currentUser(),
    builder: (BuildContext context, AsyncSnapshot<FirebaseUser> snapshot) {
      switch (snapshot.connectionState) {
        case ConnectionState.none:
          return Text('Press button to start.');
        case ConnectionState.active:
        case ConnectionState.waiting:
          return Text('Awaiting result...');
        case ConnectionState.done:
          if (snapshot.hasError)
            return Text('Error: ${snapshot.error}');
          return FutureBuilder(
            future: Firestore.instance.collection('users').document(snapshot.data.uid).get(),
            builder: (BuildContext context,
                AsyncSnapshot<DocumentSnapshot> user) {
              switch (user.connectionState) {
                case ConnectionState.none:
                  return Text('Press button to start.');
                case ConnectionState.active:
                case ConnectionState.waiting:
                  return CircularProgressIndicator();
                case ConnectionState.done:
                  if (user.hasError)
                    return Text('Error: ${user.error}');
                  return Padding(
                    padding:
                    const EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0),
                    child: Text(
                      user.data['name'],// Im assuming in CloudFirestore your field name is name.
                      style: TextStyle(
                          fontFamily: 'Montserrat',
                          fontWeight: FontWeight.bold,
                          fontSize: 17.0),
                    ),
                  );
              }
              return null; // unreachable
            },
          );
      }
      return null; // unreachable
    },
  );
}

如果您在全球有当前用户

  Future<FirebaseUser> user;

  // you may get it in initState
  @override
  void initState() {
    user = FirebaseAuth.instance.currentUser();
    super.initState();
  }

这样就够了,

  return FutureBuilder(
    future: Firestore.instance.collection('users').document(user.uid).get(),
    builder: (BuildContext context,
        AsyncSnapshot<DocumentSnapshot> user) {
      switch (user.connectionState) {
        case ConnectionState.none:
          return Text('Press button to start.');
        case ConnectionState.active:
        case ConnectionState.waiting:
          return Text('Awaiting result...');
        case ConnectionState.done:
          if (user.hasError)
            return Text('Error: ${user.error}');
          return Padding(
            padding:
            const EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0),
            child: Text(
              user.data['name'],
              style: TextStyle(
                  fontFamily: 'Montserrat',
                  fontWeight: FontWeight.bold,
                  fontSize: 17.0),
            ),
          );
      }
      return null; // unreachable
    },
  );

推荐阅读