-
-
Notifications
You must be signed in to change notification settings - Fork 10.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Bug]: setSearchParams is breaking Navigate behavior #11563
Comments
I'm observing a similar issue. Redirect with Update: Update 2: only redirect is fixed but not the Update 3: according to this comment redirect should be performed with |
Would you mind creating a working reproduction in codesandbox or stackblitz we can use to triage? |
This issue has been automatically closed because we haven't received a response from the original author 🙈. This automation helps keep the issue tracker clean from issues that aren't actionable. Please reach out if you have more information for us! 🙂 |
What version of React Router are you using?
6.20.1
Steps to Reproduce
I'm using the useRoutes hook from 'react-router-dom' for the creation of my Router
The main.jsx file
And the App.js
In my
<MainLayout />
, I have the header and footer of the pages. The header has a search bar. When the app starts, I use useEffect to check if there are any search parameters in the query, and if there are, I fill in the search bar with them.When you open the application at '/', it should automatically redirect to the feed page. However, it doesn't do that because of how setSearchParams is used in the handleFetchData function to retrieve the search query if it exists. Here's what's happening: it goes to '/', redirects to '/feed', then immediately returns to '/', resulting in a blank page (except for the header and the footer).
My theory is that when you first visit '/', setSearchParams captures the URL and attempts to extract the search parameters from it. But because JavaScript works asynchronously, it doesn't wait for this process to finish before moving on, so it quickly redirects to the '/feed' page. Since setSearchParams doesn't find any search terms, it just goes back to the original page ('/')
Expected Behavior
Automatically redirect to the feed page.
Actual Behavior
Redirect to the feed page, and instantly return to the '/' page. And stucks there.
The text was updated successfully, but these errors were encountered: