T
TanStack4mo ago
conscious-sapphire

change url in address bar without navigating

Hi, I was wondering if there is any way to just change the url in the browser's address bar. No routing, no rerenders. I tired to manually call
window.history.replaceState(null, "", newUrl)
window.history.replaceState(null, "", newUrl)
but it seems like Tanstack Router still performs a navigation. All I want to do is change the path so that reloads (and copy+paste) would direct the user to the correct path.
6 Replies
absent-sapphire
absent-sapphire4mo ago
no just navigate why would you not want to do that?
conscious-sapphire
conscious-sapphireOP4mo ago
It's not absolutely necessary but would make my code a bit simpler. I am currently reading from a stream in my component (which is in one path) but the stream is logically tied to a different path. So when users refresh they should go to the correct resource But if there's no way to do this then I'll just have to restructure some things
absent-sapphire
absent-sapphire4mo ago
the url is THE state for the router
conscious-sapphire
conscious-sapphireOP4mo ago
yeah that makes sense 👍 thanks
continuing-cyan
continuing-cyan4mo ago
Route masking could perhaps be useful for whatever you're trying to do?
Route Masking | TanStack Router React Docs
Route masking is a way to mask the actual URL of a route that gets persisted to the browser's history and URL bar. This is useful for scenarios where you want to show a different URL than the one that...
quickest-silver
quickest-silver3mo ago
This does not solve the issue because when you navigate to the current url with a mask the router does nothing, i.e.
navigate({
to: currentUrl,
mask: {
to: newUrl,
},
replace: true,
});
navigate({
to: currentUrl,
mask: {
to: newUrl,
},
replace: true,
});

Did you find this page helpful?