如何解决Rxdart Vanilla Bloc中的Flutter Debounce API调用
我在实现无限listview的地方有一个香草集团。到目前为止,我已经做到了。这是我的bloc实现,将数据像这样加载到无限列表视图中。
class MyProductsBloc {
final MyProductsRepo _repository = MyProductsRepo();
final BehaviorSubject<MyProducts> _subject = BehaviorSubject<MyProducts>();
int _page;
getMyProducts() async {
_page = 1;
MyProducts response = await _repository.getProducts(page: 1);
_subject.sink.add(response);
}
getMoreProducts() async {
_page++;
MyProducts response =
await _repository.getProducts(page: _page);
if (response.success) {
_subject.value.maxPage = response.maxPage;
_subject.value.pageNum = response.pageNum;
_subject.value.data.addAll(response.data);
_subject.sink.add(_subject.value);
} else {
_page--;
}
}
dispose() {
_subject?.close();
}
BehaviorSubject<MyProducts> get subject => _subject;
}
在UI部分上,我使用的是streambuilder,它具有带listview的notifylistner来监听滚动通知。
StreamBuilder<MyProducts>(
stream: myProductsBloc.subject.stream,builder: (context,snapshot) {
if (snapshot.hasData) {
if (snapshot.data.error != null &&
snapshot.data.error.length > 0) {
return ShowError(
error: snapshot.data.error,onTap: () => myProductsBloc.getMyProducts(),);
} else if (snapshot.data.data.length == 0) {
return EmptyWidget();
}
return NotificationListener<ScrollNotification>(
onNotification: (ScrollNotification scrollInfo) {
if (scrollInfo.metrics.pixels ==
scrollInfo.metrics.maxScrollExtent) {
if (snapshot.data.isEnd) {
return false;
} else {
myProductsBloc.getMoreProducts();
}
}
return false;
},child: ListView(
children: [
ListView.separated(
primary: false,shrinkWrap: true,separatorBuilder: (context,i) =>
const SizedBox(height: 10),padding: EdgeInsets.all(10),itemCount: snapshot.data.data.length,itemBuilder: (context,i) {
ProductData productData = snapshot.data.data[i];
return ProductCard(product: productData);
},),LoadMoreIndicator(isEnd: snapshot.data.isEnd),],);
} else if (snapshot.hasError) {
return Center(
child: Text('${snapshot.data.error}'),);
} else {
return Center(
child: LoadingWidget(text: "Fetching products.."));
}
}),
但是当滚动时,api被多次调用。在这种模式下,有什么方法可以多次消除对api的反跳?
解决方法
class MyProductsBloc {
var _isLoading = false; <---- add this variable
final MyProductsRepo _repository = MyProductsRepo();
final BehaviorSubject<MyProducts> _subject = BehaviorSubject<MyProducts>();
int _page;
getMyProducts() async {
_page = 1;
MyProducts response = await _repository.getProducts(page: 1);
_subject.sink.add(response);
}
getMoreProducts() async {
if (_isLoading) return;
_isLoading = true;
try {
_page++;
MyProducts response = await _repository.getProducts(page: _page);
if (response.success) {
_subject.value.maxPage = response.maxPage;
_subject.value.pageNum = response.pageNum;
_subject.value.data.addAll(response.data);
_subject.sink.add(_subject.value);
} else {
_page--;
}
} finally { _isLoading = false; }
}
dispose() {
_subject?.close();
}
BehaviorSubject<MyProducts> get subject => _subject;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。