Разбивка на страницы Graphql с использованием метода обратного вызова flutter fetchmore, который снова обновляет мой listview с индекса 0

#flutter #dart #graphql #flutter-layout #graphql-flutter

#flutter #dart #graphql #flutter-layout #graphql-flutter

Вопрос:

Я пытаюсь использовать плагин graphql_flutter для извлечения данных из graphql api. в этом у меня есть разбивка на страницы с использованием смещения, если смещение равно 0, он извлекает первые 10 элементов, если смещение увеличивается на 1, он извлекает следующие 10, поэтому, когда я использую метод обратного вызова fetchmore запроса graphql, он снова вызывает мой метод builder, который обновляет мой списокопять же, чего я не хочу, я хочу, чтобы после прокрутки пользователем с максимальной позицией данные загружались только с этой позиции. он не должен перезагружать мой список и добавлять данные, он просто добавляет данные в мой список. ниже приведен мой запрос

мой код метода сборки

  Widget build(BuildContext context) {
    // TODO: implement build
    MoengageFlutter.getInstance()
        .trackEvent(StringConstants.loanListingScreen, null);
    // Analytics().logCustomEvent(StringConstants.loanListingScreen, null);
    // if (offset == 0) {
    getLoanProducts =
        """query($offset: Int!, $confKey: String!, $operator: String!) {
    user{
        products(product_id: "",filter:[{
            setting_type: "sort",
            setting: [
                {
                    conf_key: $confKey,
                    operator: $operator
                },
            ]
        }
        ], limit: 10, offset: $offset) {
            total
            data{
                id
                name
                loan_type
                partner_id
                internal_rating
                playstore_rating
                interest_rate_min
                interest_rate_max
                loan_amount_min
                loan_amount_max
                processing_fee_percentage
                processing_fee_min
                processing_fee_max
                required_documents
                duration_min
                duration_max
                duration_min_unit
                duration_max_unit
                app_url
                partner {
                    id
                    name
                    logo
                    short_description
                    term_link
                    support_contact
                    support_email                    
                }
            }
        }
    }
}""";

    // }
    // productListingBloc.getProductListingBloc(getLoanProducts).then((value){
    //   print(value);
    // });
    return Query(
        options: QueryOptions(document: gql(getLoanProducts), variables: {
          "offset": offset,
          "confKey": confKey,
          "operator": _operator
        }),
        builder: (QueryResult result,
            {VoidCallback refetch, FetchMore fetchMore}) {
          if (result.hasException) {
            return Container(
                width: ResponsiveRenderer().widthOfItem(context),
                child: UnknownErrorState(
                  errorImage: StringConstants.unknownErrorStateImage,
                  text: StringConstants.unknownErrorStateText,
                  titleText: StringConstants.unknownErrorOccurredText,
                ));
          }

          if (result.isLoading) {

            return offset == 0
                ? Center(
                    child: CircularProgressIndicator(),
                  )
                : Center(child: CircularProgressIndicator());
          }
          return Scaffold(
              backgroundColor: Colors.white,
              appBar: !_isAppBar
                  ? AppBar(
                      automaticallyImplyLeading: false,
                      elevation: 0,
                      backgroundColor: HexColor(ColorConstants.white),
                    )
                  : AppBar(
                      automaticallyImplyLeading: false,
                      title: Container(
                        child: TextCustom(
                          text: StringConstants.loansText,
                          textAlign: TextAlign.left,
                          hexColor: ColorConstants.black,
                          fontSize: DimensionConstants.textSize18,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                      actions: [
                        InkWell(
                          onTap: () {
                            MoengageFlutter.getInstance().trackEvent(
                                StringConstants.sortButtonLoanListing, null);
                            Analytics().logCustomEvent(
                                StringConstants.sortButtonLoanListing, null);
                            showSortBottomSheet(refetch);
                          },
                          child: Container(
                            margin: EdgeInsets.only(
                                right: DimensionConstants.margin16,
                                top: DimensionConstants.margin12),
                            child: Row(
                              children: [
                                Container(
                                  margin: EdgeInsets.only(
                                      right: DimensionConstants.margin8),
                                  child:
                                      SvgPicture.asset("assets/loan/sort.svg"),
                                ),
                                TextCustom(
                                  text: StringConstants.sortText,
                                  hexColor: ColorConstants.black,
                                  fontSize: DimensionConstants.textSize14,
                                ),
                              ],
                            ),
                          ),
                        )
                      ],
                      elevation: 0,
                      backgroundColor: Colors.white,
                    ),
              body: BlocBuilder<NetworkBloc, NetworkState>(
                  builder: (context, state) {
                if (state is ConnectionFailure) {
                  return Center(
                    child: UnknownErrorState(
                      errorImage: StringConstants.noInternetStateImage,
                      titleText: StringConstants.noInternetStateText,
                      text: StringConstants.noInternetStateSubText,
                    ),
                  );
                }

                ProductListing listData = ProductListing.fromJson(result.data);
                if (listData.user.products == null ||
                    listData.user.products.data.length == 0) {
                  return Container(
                    child: Center(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Container(
                            child: Image.asset(
                              "assets/loan/loan_error_state.png",
                              width: ResponsiveRenderer().widthOfItem(context) *
                                  0.8,
                              height:
                                  ResponsiveRenderer().heightOfItem(context) *
                                      0.4,
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(
                                top: DimensionConstants.margin16),
                            child: TextCustom(
                              text: StringConstants.noLoansFoundText,
                              fontSize: DimensionConstants.textSize16,
                              fontWeight: FontWeight.w500,
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(
                                top: DimensionConstants.margin16),
                            child: TextCustom(
                              text: StringConstants
                                  .checkLocationAndPersonalDetails,
                              fontSize: DimensionConstants.textSize12,
                              hexColor: ColorConstants.greyDark,
                            ),
                          ),
                          InkWell(
                            onTap: () {
                              MoengageFlutter.getInstance().trackEvent(
                                  StringConstants.editProfileButtonLoanListing,
                                  null);
                              Analytics().logCustomEvent(
                                  StringConstants.editProfileButtonLoanListing,
                                  null);
                              Navigator.of(context)
                                  .pushNamed(MyProfile.routeName,
                                      arguments: MyProfile(
                                        phoneNumber: null,
                                      ));
                            },
                            child: Container(
                              margin: EdgeInsets.only(
                                  top: DimensionConstants.margin16),
                              child: TextCustom(
                                text: StringConstants.editProfileText,
                                fontSize: DimensionConstants.textSize14,
                                fontWeight: FontWeight.w500,
                                hexColor: ColorConstants.blue,
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  );
                } else {
                  _scrollController
                    ..addListener(() {
                      if (_scrollController.position.pixels ==
                          _scrollController.position.maxScrollExtent) {
                        if (total > current) {
                          offset  ;
                          FetchMoreOptions opts = FetchMoreOptions(
                            variables: {
                              'offset': offset,
                              "confKey": confKey,
                              "operator": _operator
                            },
                            document: gql(getLoanProducts),
                            updateQuery:
                                (previousResultData, fetchMoreResultData) {
                              print(fetchMoreResultData);
                              final List<dynamic> repos = [
                                ...previousResultData['user']['products']
                                    ['data'] as List<dynamic>,
                                ...fetchMoreResultData['user']['products']
                                    ['data'] as List<dynamic>
                              ];

                              fetchMoreResultData['user']['products']['data'] =
                                  repos;
                              productList = repos;
                              return fetchMoreResultData;
                            },
                          );

                          fetchMore(opts);
                        }
                      }
                    });
                  current =
                      (offset * limit)   listData.user.products.data.length;
                  total = listData.user.products.total;
                  return Column(
                    children: [
                      // Container(
                      //   margin: EdgeInsets.only(
                      //       left: DimensionConstants.margin12,
                      //       top: DimensionConstants.margin16),
                      //   child: TextCustom(
                      //     text: StringConstants.loanListingDescription,
                      //     textAlign: TextAlign.left,
                      //     fontSize: DimensionConstants.margin14,
                      //     hexColor: ColorConstants.black,
                      //   ),
                      // ),
                      // _sortAndFilter(),
                      Expanded(
                        child: ListView.builder(
                            controller: _scrollController,
                            shrinkWrap: true,
                            itemCount: listData.user.products.data.length,
                            itemBuilder: (context, index) {
                              return Container(
                                  padding: EdgeInsets.only(
                                      top: DimensionConstants.margin16,
                                      bottom: DimensionConstants.margin16),
                                  child: CardCustomLoanList(
                                      listData: listData, index: index));
                            }),
                      ),
                    ],
                  );
                }
              }));
        });
  }```
here fetch more calling builder method again which is refreshing my whole list I don't want to refresh my whole list
Please anyone knows any better way to do this?


  [1]: https://pub.dev/packages/graphql_flutter