I'm using React and Electron to create a native app and I want to pass a file path from my main Electron process to one of my React components to render HTML in the file. I decided to do this using a URL, so I used the following route:
export default function App() {
return (
<Router>
<Routes>
<Route path="/3D-Graph/*" element={
<UserContext.Provider value={"3D-Graph"}>
<GraphApp />
</UserContext.Provider>
} />
<Route path="/" element={
<UserContext.Provider value={"2D-Graph"}>
<GraphApp />
</UserContext.Provider>
} />
</Routes>
</Router>
);
}
Then I use this in the GraphApp component to get the HTML:
const htmlFile = new URLSearchParams(useLocation().search).get('graph-path')
However, when I run this command, I get the following output: Rewrite GET /index.html/3D-Graph/?graph-path=3D-Graph to /index.html
I don't know if this is done by Electron when I use the loadURL function, or if it's done by React during its routing process. How do I stop it from doing this so I can route the application? Or am I approaching this the wrong way?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
I have sent the file path from main in the past like this:
main:
or:
ipcMain.on("eventFromRenderer", (event) => { event.sender.send(”file-path-reply”, ”PATH TO YOUR FILE”) }Rendering:
const MyComponent = () => { const [htmlPath, setHtmlPath] = useState(””); useEffect(() => { const reply = (evt, message) => { setHtmlPath(message); } ipcRenderer.on(”file-path-reply”, reply); }, []); // use htmlPath… }Hope this helps! The capitalization is a bit weird, I wrote it using the autocorrect function on my phone :)