从分页的API抖动中加载数据

时间:2020-07-11 08:43:55

标签: flutter dart rxdart dio

我正在尝试从api的api端点获取分页数据。我正在将rxdart库与dio一起用于管理api请求。 这是存储库:

class EventRepository {
  Future<EventResponse> getEvents({page}) async {
    try {
      var response = await apiCall.getData('events?page=$page&limit=10&q=');
      var data = response.data;
      return EventResponse.fromJson(data);
    } catch (error, stacktrace) {
      print("Exception occured: $error stackTrace: $stacktrace");
      
    }
  }
}

这是eventBloc:

class EventBloc {
  final EventRepository _repository = EventRepository();
  final BehaviorSubject<EventResponse> _subject =
      BehaviorSubject<EventResponse>();

  getEvents({page}) async {
    EventResponse response = await _repository.getEvents(page: page ?? 1);
    _subject.sink.add(response);
  }

  dispose() {
    _subject.close();
  }

  BehaviorSubject<EventResponse> get subject => _subject;
}
final eventBloc = EventBloc();
List<Event> eventList = List<Event>();
StreamBuilder<EventResponse>(
            stream: eventBloc.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: () => eventBloc.getEvents(),
                  );
                } else if (snapshot.data.data.data.length == 0) {
                  return EmptyWidget("No resources added yet.");
                } else {
                  updateList(snapshot.data.data.data);
                  return ListView(
                    children: <Widget>[
                      buildList(data: eventList),
                      (page < snapshot.data.data.totalPages)
                          ? Container(
                              padding: const EdgeInsets.all(20),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  GestureDetector(
                                      onTap: () {
                                        setState(() {
                                          page++;
                                        });
                                        eventBloc.getEvents(page: page);
                                      },
                                      child: Text("View More",
                                          style: Theme.of(context)
                                              .textTheme
                                              .subtitle1
                                              .copyWith(color: Colors.blue)))
                                ],
                              ),
                            )
                          : Text("End of Results.",
                              style: Theme.of(context).textTheme.subtitle1),
                    ],
                  );
                }
              } else if (snapshot.hasError) {
                return Center(
                  child: Text('${snapshot.error}'),
                );
              } else {
                return Center(child: LoadingWidget(text: "Fetching events"));
              }
            }),

在这里,当我接收数据时,我正在更新eventList,并且buildList返回显示eventData的listView构建器。问题是,我在列表中得到重复。这是可行的,但它是一种顽强的逻辑。希望就如何解决或改善这种情况提出一些建议。

0 个答案:

没有答案