I am using useInfiniteQuery hook for infinite scrolling items in my component. I want that the first fetch happens only when the view is visible in the viewport. I am using useInView/intersection observer for finding if the view is visible in viewport.
I am using useInView/intersection observer for finding if the view is visible in viewport, but unable to restrict the first fetch on the basis of this.
I'm assuming you are talking about the useInfiniteQuery
hook from @tanstack/react-query
. This hook actually inherits all options from useQuery
, which takes an enabled
property, that determines when it will be triggered. Assuming you have a boolean that determines the state of your IntersectionObserver
, you could do something like this:
useInfiniteQuery('data', fetchData, {
enabled: valueFromIntersectionObserver
});
Refer to the documentation of the useQuery
hook for more details.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.