'How to modify a React Router Location?

I'm using the useQueryParams library, which takes a RouteAdapter, which is forwarded a Location, which can be sent to React Router to trigger a navigation.

I want to redirect the user depending on the values in the query string but I want to preserve the query string after the redirect. So, how can I best modify the Location object to the redirected path? Is it a simple matter of updating the path property?

location.pathname = 'mynewpath';
navigate(location, { replace: true, state: location.state });

Or is a shallow clone better?

const newLocation = { ...location, pathname: 'mynewpath' };
navigate(location, { replace: true, state: location.state });

Do these changes render the hash invalid?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source