颤振-变换颤振块事件以添加去抖动

Question

我正在尝试使用flutter块制作一个无限列表。

我参考了以下内容：https://github.com/felangel/bloc/blob/926029cae2d7614d38b5a9a8952e36bb59054b02/examples/github_search/common_github_search/lib/src/github_search_bloc/github_search_bloc.dart#L15

根据这篇文章，为了在两个事件之间添加延迟，这样api就不会被垃圾邮件，你需要覆盖transformEvents，并为这样的事件添加debounce：

@override
Stream<GithubSearchState> transformEvents(
Stream<GithubSearchEvent> events,
Stream<GithubSearchState> Function(GithubSearchEvent event) next,
) {
return (events as Observable<GithubSearchEvent>)
.debounceTime(
Duration(milliseconds: 300),
)
.switchMap(next);
}

我面临的问题是，Observable已经被RxDart弃用，我不确定如何实现上述要求。

Answer 1

自从bloc8.0.0以来，语法发生了变化，您需要将其作为转换器传递给on函数。除了debouncing之外，您还应该考虑并发性。要将顺序处理与去抖动相结合，您可以提供以下功能：

import 'package:rxdart/rxdart.dart';
//...
on<GithubSearchEvent>(
(event, emit) {},
transformer: (events, mapper) {
return events.debounceTime(const Duration(milliseconds: 300)).asyncExpand(mapper);
},
);

您可以创建一个可重复使用的转换器作为顶级函数，如下所示：

EventTransformer<Event> debounceSequential<Event>(Duration duration) {
return (events, mapper) => events.debounceTime(duration).asyncExpand(mapper);
}

并像这样使用：

on<GithubSearchEvent>(
(event, emit) {},
transformer: debounceSequential(const Duration(milliseconds: 300)),
);

Answer 2

我找到了解决方案。

@override
Stream<Transition< GithubSearchEvent, GithubSearchState >> transformEvents(
Stream< GithubSearchEvent > events, transitionFn) {
return events
.debounceTime(const Duration(milliseconds: 300))
.switchMap((transitionFn));
}

Answer 3

我无法向@user2220771添加评论，因为我的声誉太低。

这将不起作用：

EventTransformer<Event> debounceTransformer<Event>(Duration duration) {
return (events, mapper) => events.debounceTime(duration);
}

你必须将地图切换为：

EventTransformer<Event> debounceTransformer<Event>(Duration duration) {
return (events, mapper) {
return events.debounceTime(duration).switchMap(mapper);
};
}

Answer 4

我遇到了类似的问题，我可以通过添加以下导入来解决它

import 'package:stream_transform/stream_transform.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

然后，我们可以提供一个自定义的EventTransformer来更改Blob处理传入事件的方式。

EventTransformer<T> debounce<T>(Duration duration) {
return (events, mapper) => events.debounceTime(duration).flatMap(mapper);
}

现在，我们可能希望取消对后端的请求，以避免受到速率限制，并降低后端的成本/负载。

CounterBloc() : super(0) {
on<Increment>(
(event, emit) => emit(state + 1),
/// Apply the custom `EventTransformer` to the `EventHandler`.
transformer: debounce(const Duration(milliseconds: 300)),
);
}

注意：我使用的是flutter_bloc: ^8.1.1