Sometimes, we want to use React Router with Electron.
In this article, we’ll look at how to use React Router with Electron.
How to use React Router with Electron?
To use React Router with Electron, we can use HashRouter
.
For instance, we write
import { HashRouter, Route } from "react-router-dom";
to import HashRouter
.
Then we write
<HashRouter>
<div>
<Route path="/" exact component={Home} />
<Route path="/firstPage" component={FirstPage} />
<Route path="/secondPage" component={SecondPage} />
</div>
</HashRouter>
to wrap HashRouter
around our Route
s to render them.
HashRouter
works because Electron runs our React app in a file-based environment.
Conclusion
To use React Router with Electron, we can use HashRouter
.
2 replies on “How to use React Router with Electron?”
really helpful
It would be great if you could show how to transition from one page to the next. For example, say I have a Button (and I’m using @material-ui for controls) and the button click takes me to another page, what would that look like and how would I set up the onclick handler for that button to take me to another page? Thanks in advance!