Can we use MemoryRouter inside BrowserRouter in v6? (The <MemoryRouter> pattern)

[dorin-js]

According to this article in v5 we could use 2 routers, one BrowserRouter for top level component and 2nd MemoryRouter when team doesn’t want any /onboarding/* URL to be publicly visible in the browser URL. I have tried to implement it in v6 but i get error:

You cannot render a inside another . You should never have more than one in your app.

Im so upset :(

[jamesmarrs]

Unfortunately I dont think a lot of people saw how powerful the <MemoryRouter /> was, and the documentation downplays its significance and usage. The fact it can be used to orchestrate your components / modals / tabs without writing logic is mind blowing.

The <MemoryRouter /> was great for complex components inside of your <BrowserRouter /> that you did not want to expose to browser history (example: a complex side panel, with its own tabs and modals, etc).

If you have been following, i think @timdorr is on the right track here: #9601 (comment)

You can technically fork it, and hotfix this at your own risk in the react-router package to get the intended behavior quickly.

Remove this bit of code here:

react-router/packages/react-router/lib/components.tsx

Lines 318 to 322 in 1634af2

	invariant(
	!useInRouterContext(),
	`You cannot render a <Router> inside another <Router>.` +
	` You should never have more than one in your app.`
	);

If you are in your <MemoryRouter />, and you need to navigate within your browser router (since your current context of your useNavigate hook controls routing within the memory router), you can import your browser router routes like this:

import { router } from "YOUR_ROUTER";

and then use it like:

router.navigate("SOME_BROWSER_ROUTER_ROUTE")

[yalcinozer]

I have a mini game which has its own routing besides to the main website routing in my personal website. Now I am using v6 and it throws error. This is just annoying, combination of different routers creates the best solution sometimes.

[Nagaraj104065]

same problem.

[DragoshDX]

Absolutely infuriating that this has not been fixed for a year.

Has anyone maybe tried a workaround? What about loading another router altogether?

[DragoshDX]

for all it's worth
I did manage to jery rig this into working with some parallel inmemory routers and CSS Grid kung fu :D
I have a browser router and memory routers (plural) running along side and playing ball, and through the magic of CSS Grid it visually looks like what I needed

v5 was still better tho

[SC7639]

I want the routes to be usable in the address bar but don't want to update the url

[gabrielucido]

So sad, I just was going to obliterate the homemade MemoryRouter that a mf did and is complex as fuck to understand with a simple and widely used solution that already existed. So sad to see it's still like this today

[brophdawg11]

FWIW, there is an open proposal for this - make sure you give that an upvote for consideration: #9601

[chrisjlee]

There any PR related to this recently? Looks like #9601 is dead?