Omri Aharon Omri Aharon - 2 months ago 24
React JSX Question

React Router Without Changing URL

I need to have routing that works without changing the URL.

Before implementing this on my own, I tried to look for something by react router. I saw that there is such a thing called

createMemoryHistory
:


createMemoryHistory([options])

createMemoryHistory creates an in-memory history object that does not
interact with the browser URL. This is useful for when you need to
customize the history object used for server-side rendering, for
automated testing, or for when you do not want to manipulate the
browser URL, such as when your application is embedded in an iframe.


But beyond this paragraph there aren't any usage examples and I can't find a usage for this anywhere, i.e: how to use
Link
component to navigate without a pathname, by which parameter do I route if not pathname, etc.

Is this right for my needs, or do I have to implement a router on my own?

Answer

MemoryHistory is a "history provider", which you can supply to React Router like this:

const memoryHistory = createMemoryHistory(options);

// In your Router configuration
<Router history={memoryHistory} routes={routes} />

Beyond the initial configuration, everything else should work exactly the same as with regular browser history.

This article describes how to use different providers with React Router: Histories