Flutter firestore stream pagination (firestore 쿼리 페이지화하기)

구현내용

Firebase의 Firestore로부터 받아 오는 stream 데이터를 스크롤이 끝날 때 마다 지정한 갯수만큼 새로 받아온다

---

1. 패키지 다운로드

패키지 : https://pub.dev/packages/paginate_firestore

paginate_firestore | Flutter Package

2.방법

FirestoreQueryBuilder클래스를 사용하며, pageSize 프로퍼티로 불러올 데이터의 갯수를 정한다.

query: 에는 원하는 쿼리를 넣어주면 된다 

FirestoreQueryBuilder(
            pageSize: 5,  //불러올 데이터 개수 지정
            query: FirebaseFirestore.instance
                .collection('collectionName')
                .where('field', isEqualTo: '${data}'),  //쿼리는 일반 StreamBuilder처럼 커스텀하시면 됩니다
            builder: (context, snapshot, _) {
              if (snapshot.isFetching) {
                return Center(child: CupertinoActivityIndicator(),);
              }
              if (snapshot.hasError) {
                return Center(child: Text('에러 메시지'),);
              } else {
                return ListView.builder(
                  itemCount: snapshot.docs.length,
                  itemBuilder: (context, index) {
                  
                  //화면의 끝으로 스크롤이 되었을 때 새로 데이터를 갱신해준다
                    if (snapshot.hasMore && index + 1 == snapshot.docs.length) {
                      snapshot.fetchMore();
                    }

                    var docs = snapshot.docs[index];
                    
                    //docs나 snapshot을 가지고 원하는 것을 하면 된다
                    return Container();
                  },
                );
              }
            },
          ),

여기서 중요한 것 중 하나가

if (snapshot.hasMore && index + 1 == snapshot.docs.length) {
  snapshot.fetchMore();
}

이것을 빼먹으면 새로 리프레쉬가 안되니 빼먹지 않도록 한다