Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to pass more parameters in useInfiniteQuery?

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

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

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

>Solution :

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.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading