Flutter Infinity滚动：如何每滚动一次触发它

Question

我正在构建到Flutter应用程序的导航（Infinity Scroll），并且我从逻辑上成功做到了这一点（滚动更多数据）。

但是我现在面临一个巨大的问题，那就是我正在DDOS攻击我的服务器：“ S

[向下滚动时，我每次上下发送100多个请求！！！

由于以下代码而发生

final _scrollThreshold = 200;

void _onScroll() {
  final maxScroll = _scrollController.position.maxScrollExtent;
  final currentScroll = _scrollController.position.pixels;
  if (maxScroll - currentScroll <= _scrollThreshold) {
    BlocProvider.of<SearchBloc>(context).add(SearchPosts(
      pageNo: _pageNo++,
      query: _searchText.text
    ));
  }
}

在最后一个范围（最后200个像素）中的问题，如果用户没有动手并且没有等待并继续播放以告知下一页已加载，该函数将持续触发很多

因此，如何解决此问题，使其每滚动一个页面仅发出一个请求（页面）

Answer 1

我有同样的问题。要解决此问题，您应在等待响应时从ScrollController删除_onScroll回调。之后，当收到数据时，应再次将其添加到ScrollController中。您的_onScroll方法应如下更改：

void _onScroll() {
  final maxScroll = _scrollController.position.maxScrollExtent;
  final currentScroll = _scrollController.position.pixels;
  if (maxScroll - currentScroll <= _scrollThreshold) {
    _scrollController.removeListener(_onScroll);
    BlocProvider.of<SearchBloc>(context).add(SearchPosts(
      pageNo: _pageNo++,
      query: _searchText.text
    ));
  }
}

并且不要忘记在收到数据后再次添加它。但是，我意识到当用户快速滚动时，可以两次调用此方法。为了解决这个问题，我在bloc类中使用了RxDart并将其transformEvents方法重写为如下形式：

  @override
  Stream<S> transformEvents(
      Stream<E> events, Stream<S> Function(E) next) {
    return super.transformEvents(
      events.debounceTime(
        Duration(milliseconds: 300),
      ),
      next,
    );
  }

祝你好运