Flutter接入Firebase实现分页拉取文档时无数据返回问题求助

问题根因梳理 #

• 滚动监听逻辑变量名错误：定义的滚动控制器是_scrollController，但监听回调里全部用了不存在的_hideButtonController，导致滚动分页触发逻辑完全失效
• 拉取到的文档快照未缓存：声明了_forumSnapshot数组用来存分页锚点，但从未把拉取到的DocumentSnapshot存入数组，第二次分页请求时startAfter参数无有效锚点
• 列表赋值逻辑错误：只有当拉取到的列表长度小于limit时才会给_forumList赋值，也就是说首次拉取刚好10条（符合limit值）时，_forumList永远不会被赋值，自然没有数据展示
• 新拉取的数据未做追加：当前逻辑是直接覆盖_forumList，而非追加新分页的数据，无法实现滚动加载更多的效果
• _hasNext状态未更新：分页结束标识位从未赋值，后续无法判断是否还有更多数据可加载

修正后的完整代码 #

页面状态与初始化部分 #

int limit = 10;
bool _hasNext = true;
bool _isFetchingForum = false;
ScrollController _scrollController;
List<Forum> _forumList = [];
final _forumSnapshot = <DocumentSnapshot>[];

@override
void initState() {
  super.initState();
  // 先初始化控制器再调用接口、添加监听
  _scrollController = ScrollController();
  _setupForumFeed();
  _scrollController.addListener(() {
    // 修正控制器变量名，补充判断避免重复请求
    if (_scrollController.offset >= _scrollController.position.maxScrollExtent &&
        !_scrollController.position.outOfRange &&
        _hasNext && !_isFetchingForum) {
      _setupForumFeed();
    }
  });
}

数据拉取逻辑调整 #

_setupForumFeed() async {
  if (_isFetchingForum) return;
  _isFetchingForum = true;
  // 接收返回的快照和模型列表
  Map<String, dynamic> result = await DatabaseService.getFeedForums(
      widget.currentUserId, limit,
      startAfter: _forumSnapshot.isNotEmpty ? _forumSnapshot.last : null);
  List<Forum> newForums = result['forums'];
  List<DocumentSnapshot> newSnapshots = result['snapshots'];

  if (mounted) {
    setState(() {
      // 追加新数据而非覆盖
      _forumList.addAll(newForums);
      // 缓存新的快照作为下一次分页的锚点
      _forumSnapshot.addAll(newSnapshots);
      // 更新是否还有更多数据的标识
      if (newForums.length < limit) {
        _hasNext = false;
      }
    });
  }
  _isFetchingForum = false;
  print(_forumList.length.toString() + 'ffff');
}

数据库查询方法调整 #

static Future<Map<String, dynamic>> getFeedForums(String userId, int limit,
    {DocumentSnapshot startAfter}) async {
  QuerySnapshot forumFeedSnapShot;
  if (startAfter == null) {
    forumFeedSnapShot = await forumFeedsRef
        .doc(userId)
        .collection('userForumFeed')
        .orderBy('timestamp', descending: true)
        .limit(limit)
        .get();
  } else {
    forumFeedSnapShot = await forumFeedsRef
        .doc(userId)
        .collection('userForumFeed')
        .orderBy('timestamp', descending: true)
        .startAfterDocument(startAfter)
        .limit(limit)
        .get();
  }
  List<Forum> forums = forumFeedSnapShot.docs.map((doc) => Forum.fromDoc(doc)).toList();
  return {
    'forums': forums,
    'snapshots': forumFeedSnapShot.docs
  };
}

额外注意事项 #

确认你的userForumFeed集合下的所有文档都存在timestamp字段，且已对orderBy('timestamp', descending: true)查询配置了Firestore索引，否则会抛出查询异常。

内容的提问来源于stack exchange，提问作者Enam