how to tell if page is loading after initial load when refreshing with query params
Answered
Gharial posted this in #help-forum
GharialOP
So I'm using app router and I've got a list on the page. There's search/sort on the page and I have that working. I use router.replace to update query params and the server data reloads correctly. However, I'm not sure how to detect that it's reloading. I don't want to use suspense b/c after the intial load I obviously don't want to blank out the list just b/c I'm going from page 1 to page 2. The built in loading only works for the initial load (which seems correct and is fine). So how do I detect page "refreshes" and show a loading indicator while the users pagination or filtering is processing?
Answered by Ray
hi, I think you could use
useTransition hook for thatconst [isPending, startTransition] = useTransition()
startTransition(() => {
router.replace("")
})
return <div>{isPending ? "loading...": "hi"}</div>2 Replies
@Gharial So I'm using app router and I've got a list on the page. There's search/sort on the page and I have that working. I use router.replace to update query params and the server data reloads correctly. However, I'm not sure how to detect that it's reloading. I don't want to use suspense b/c after the intial load I obviously don't want to blank out the list just b/c I'm going from page 1 to page 2. The built in loading only works for the initial load (which seems correct and is fine). So how do I detect page "refreshes" and show a loading indicator while the users pagination or filtering is processing?
hi, I think you could use
useTransition hook for thatconst [isPending, startTransition] = useTransition()
startTransition(() => {
router.replace("")
})
return <div>{isPending ? "loading...": "hi"}</div>Answer
GharialOP
b'ah. that did it. Thanks