Flutter中的StreamBuilder停留在ConnectionState.waiting并仅显示加载标记

时间:2020-04-08 22:53:12

标签: firebase flutter dart async-await stream-builder

嗨,我正尝试将Firebase文档中的数据动态显示到Flutter中,并使用循环将其渲染,因此我制作了一个List<Widget> Cards并向其中添加了包含以下内容的函数makeItem()卡,并将它们放入循环中,所以问题在于,当我运行代码时,它始终将print(snapshot.connectionState);输出为ConnectionState.waiting,并且应该是异步快照,但它拒绝按要求加载数据,我应该提到的是,当我点击“在Android Studio中热重装”时,数据将按需要显示。 所以我不知道如何解决这个问题。在此先感谢

4 个答案:

答案 0 :(得分:3)

似乎这是一个古老的主题,但对于仍在寻找解决方案的人来说。将 STREAM BUILDER 与 PROVIDER&CHANGE NOTIFIER 一起使用时,我遇到了同样的问题。 当返回视图时,应该重新分配流本身。 为您的流创建一个 get 函数,并在返回流之前在该函数中重新分配流。这为我解决了加载问题。 对不起,我的解释技巧不好,希望能帮助别人:)

答案 1 :(得分:2)

我想我为您准备了一些东西。它可以在我的模拟器上运行。

List<Widget> cards = [];
  Stream<QuerySnapshot> firebaseStream;

  @override
  void initState() {
    super.initState();
    firebaseStream = Firestore.instance.collection('Hearings').snapshots();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: StreamBuilder<QuerySnapshot>(
          stream: firebaseStream,
          builder: (BuildContext context,
              AsyncSnapshot<QuerySnapshot> asyncSnapshot) {
            List<DocumentSnapshot> snapData;

            if (asyncSnapshot.connectionState == ConnectionState.waiting) {
              return Container(
                child: Center(
                  child: CircularProgressIndicator(
                    backgroundColor: Colors.amber,
                    strokeWidth: 1,
                  ),
                ),
              );
            } else if (asyncSnapshot.connectionState ==
                ConnectionState.active) {
              snapData = asyncSnapshot.data.documents;
              if (asyncSnapshot.hasData) {
                for (int i = 0; i < snapData.length; i++) {
                  Widget card = Text(snapData[i].data['locationName']);

                  cards.add(card);
                }
              }
            }
            return ListView.builder(
              itemCount: cards.length,
              itemBuilder: (context, index) => cards[index],
            );
          },
        ),
      ),
    );

我也有一个坏消息,尽管现在数据正在更新,但它暴露了逻辑上的一些缺陷,即它在阵列中复制了旧条目。你会看到的。但这应该很容易解决。

答案 2 :(得分:1)

您可以尝试以下方法吗?

[✓] Flutter (Channel master, v1.18.1-pre.9, on Mac OS X 10.15.3 19D76, locale en-NZ)
    • Flutter version 1.18.1-pre.9 at /Users/sthomas/flutter
    • Framework revision 17079f26b5 (3 days ago), 2020-04-06 01:21:01 -0400
    • Engine revision 9b8dcc7ecf
    • Dart version 2.8.0 (build 2.8.0-dev.20.0 05103dfe5a)


[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    • Android SDK at /Users/sthomas/Library/Android/sdk
    • Platform android-29, build-tools 28.0.3
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.4)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.4, Build version 11E146
    • CocoaPods version 1.9.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 3.5)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 43.0.1
    • Dart plugin version 191.8593
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)

[✓] Connected device (3 available)
    • iPhone 11 Pro Max • F01FDB37-BA30-4A31-8F90-EE6DC28CD28F • ios            • com.apple.CoreSimulator.SimRuntime.iOS-13-4 (simulator)
    • Chrome            • chrome                               • web-javascript • Google Chrome 80.0.3987.163
    • Web Server        • web-server                           • web-javascript • Flutter Tools

• No issues found!

答案 3 :(得分:0)

请使用 FutureBuilder 它解决了我的问题。