T
TanStack2mo ago
genetic-orange

Removing search params when leaving page

Is there a way to remove a search parameter when navigating away from a page? I have a page that accepts the search parameter sortBy=something. When the user navigates to another page that also supports a sortBy parameter (but with different valid values), I want to ensure that the sortBy parameter is removed so it can fall back to the default value on the new page. I tried setting strict = true in the router configuration, but since both pages accept sortBy, the parameter isn’t removed.
4 Replies
ratty-blush
ratty-blush2mo ago
Search middleware to strip search params | TanStack Router React Docs
stripSearchParams is a search middleware that allows to remove search params. stripSearchParams props stripSearchParams accepts one of the following inputs: true: if the search schema has no required...
genetic-orange
genetic-orangeOP2mo ago
@ferretwithabéret I looked into the stripSearchParams middleware, but it removes search parameters when entering a page. That means I can’t share a link to a page that already has a sortBy value set. That’s why I’m looking for a solution that removes the parameter when leaving a page instead of when entering it.
fair-rose
fair-rose2mo ago
set it to undefined explicitly?
genetic-orange
genetic-orangeOP2mo ago
@Manuel Schiller Yes, but in my case, the user can navigate using a global navigation bar that has no knowledge of the current search params. It always performs navigation with search = true, which preserves the existing search parameters (I want to preserve most of them) Because of this, I’d like to control this behavior at the route level instead, ideally removing or resetting specific search params when leaving a route, not when entering it.

Did you find this page helpful?