electron-vite(react js)> react-router-dom not working

c3frrgcw  于 11个月前  发布在  Electron
关注(0)|答案(1)|浏览(138)

我使用npm create @quick-start/electron(react js)创建了一个电子应用程序。react-router-dom库正在开发中,但尚未投入生产。
他们说electron不处理浏览器历史记录,我应该使用HashRouter而不是BrowserRouter。https://evite.netlify.app/guide/troubleshooting.html#vue-router-or-react-router-dom-works-in-development-but-not-production
有谁知道HashRouter怎么用吗?
我希望在构建应用程序时能让react-router-dom工作。
编辑

代码
main.jsx

import React from 'react'
import { HashRouter } from 'react-router-dom'

import ReactDOM from 'react-dom/client'
import App from './App'

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <HashRouter>
      <App />
    </HashRouter>
  </React.StrictMode>
)

字符串

App.jsx

import React from 'react'

// libraries
import { Routes, Route, Navigate } from 'react-router-dom'

// layouts
import PublicLayout from './layouts/PublicLayout'

// public pages
import Login from './pages/Public/Login'

const App = () => {
  return (
    <>
      <Routes>
        <Route path="/*" element={<PublicRoutes />} />
      </Routes>
    </>
  )
}

export default App

export const PublicRoutes = () => {
  return (
    <Routes>
      <Route element={<PublicLayout />}>
        <Route path="/login" element={<Login />} />
      </Route>

      <Route path="/*" element={<Navigate to="/login" replace />} />
    </Routes>
  )
}

src>main>index.js

mainWindow.loadFile(join(__dirname, '../renderer/index.html'), { hash: 'login' })

vs3odd8k

vs3odd8k1#

import { HashRouter as Router, Routes, Route } from "react-router-dom";

字符串
我使用这个约定在App.tsx中为我的项目导入react-router-dom组件。它在发布应用程序或运行npm start时有效,npm start运行--preview,在开发人员设置中为您提供应用程序的生产预览。我还需要指定:

mainWindow.loadFile(join(__dirname, '../renderer/index.html'), { hash: 'login' })


在src > main > index.ts中

相关问题