Flutter Web NoSuchMethodError 上的 Firebase 火库。 “文档”答案

【问题标题】：Firebase firestore on Flutter Web NoSuchMethodError. 'docs'Flutter Web NoSuchMethodError 上的 Firebase 火库。 “文档”
【发布时间】：2021-07-31 11:42:45
【问题描述】：

我正在尝试在网络上运行我的 Flutter 聊天应用，但遇到了这个错误

════════小部件库捕获的异常═════════════════════════════════════ ═

'文档' 找不到方法接收方：空参数：[] 相关的导致错误的小部件是流生成器

Error Message Screenshot

它正在我的 android 模拟器上运行，所以我的网络配置可能缺少，所以我尝试在我的 index.html 上添加 firebase 并遵循https://stackoverflow.com/a/67518124/15916393 的建议，但仍然出现错误。

<script src="https://www.gstatic.com/firebasejs/8.8.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-firestore.js"></script> 
<script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.1/firebase-messaging.js"></script>

这是我的代码

class Messages extends StatelessWidget {
@override 
Widget build(BuildContext context) {
final user = FirebaseAuth.instance.currentUser;
return StreamBuilder(
  stream: FirebaseFirestore.instance
      .collection('chat')
      .orderBy(
        'createdAt',
        descending: true,
      )
      .snapshots(),
  builder: (ctx, chatSnapshot) {
    if (chatSnapshot.connectionState == ConnectionState.waiting) {
      return Center(
        child: CircularProgressIndicator(),
      );
    }
    final chatDocs = chatSnapshot.data.docs ?? 'default data';
    return ListView.builder(
      reverse: true,
      itemCount: chatDocs.length,
      itemBuilder: (ctx, index) => MessageBubble(
        chatDocs[index].data()['text'],
        chatDocs[index].data()['username'],
        chatDocs[index].data()['userImage'],
        chatDocs[index].data()['userId'] == user.uid,
        key: ValueKey(chatDocs[index].id),
      ),
    );
  },
);
}
}

【问题讨论】：

标签： firebase flutter google-cloud-firestore

【解决方案1】：

你忽略了加载数据出错的情况

builder: (ctx, chatSnapshot) {
  if (chatSnapshot.connectionState == ConnectionState.waiting) {
    return Center(
      child: CircularProgressIndicator(),
    );
  }
  // ? Check if there was an error
  if (snapshot.hasError) {
    return Text('Error loading data: ${snapshot.error!}');
  }
  final chatDocs = chatSnapshot.data.docs ?? 'default data';
  ...

我强烈建议您遵循 FlutterFire 文档中示例中的模式概述，例如上面来自 reading realtime changes 的示例。

【讨论】：

flutterfire 文档对我很有帮助。感谢您提供！