How to pass more parameters in useInfiniteQuery?-CodePudding

i am using React qurey useInfiniteQuery to get more data

const { data, isLoading, fetchNextPage, hasNextPage, error, isFetching } =
useInfiniteQuery("listofSessions", listofSessions, {
  getNextPageParam: (lastPage, pages) => {
    if (lastPage.length < 10) return undefined;
    return pages.length   1;
  },
});

Api Requets

const listofSessions = async ({ groupId, pageParam = 1 }) =>
  await axios
    .get(`${apiURL}/groups/allsessions`, {
      params: {
        groupId: 63,
        page: pageParam,
      },
    })
    .then((res) => {
      return res.data.data;
    });

i want to pass groupId in listofSessions api function like that

const { data, isLoading, fetchNextPage, hasNextPage, error, isFetching } =
    useInfiniteQuery("listofSessions", listofSessions({groupId}), ....

But it gives me Missing queryFn

How can i solve this problem of passing mutiple parameters in useInfinteQuery

CodePudding user response：

Does passing a new function work?

const listofSessions = async ({ groupId, pageParam = 1 }) =>
  await axios
    .get(`${apiURL}/groups/allsessions`, {
      params: {
        groupId: 63,
        page: pageParam,
      },
    })
    .then((res) => {
      return res.data.data;
    });

// pass a new function
const { data, isLoading, fetchNextPage, hasNextPage, error, isFetching } =
useInfiniteQuery("listofSessions", ({ pageParam = 1 }) => listofSessions({ groupId, pageParam}), {
  getNextPageParam: (lastPage, pages) => {
    if (lastPage.length < 10) return undefined;
    return pages.length   1;
  },
});

If it is possible to refer to groupId inside listofSessions that would be a simpler solution.