使用React和Electron - reaction -router错误

Using React and Electron - react-router error

本文关键字:reaction -router 错误 Electron React 使用      更新时间:2023-09-26

我刚开始学习如何用电子制作桌面应用程序,我试图用电子使用react-router,但我一直得到错误Warning: [react-router] Location "/" did not match any routes

main.js

app.on('ready', () => {
  win = new BrowserWindow({width: 800, height: 600});
  win.loadURL(`file://${__dirname}/index.html`);
  win.webContents.openDevTools();
  win.on('closed', () => win = null);
})

routes.js

import App from './app';
import { Router, Route, hashHistory } from 'react-router';
import React from 'react';
const routes = (
  <Router>
    <Route path="/" component={App}/>
  </Router>
);

index.js

import ReactDOM from 'react-dom';
import React from 'react';
import { Router, hashHistory } from 'react-router';
import routes from './routes';
ReactDOM.render(<Router routes={routes} history={hashHistory}/>, document.getElementById('app'));

app.js

import React, { Component } from 'react';
export default class App extends React.Component {
  render() {
    return (
      <div>
        {this.props.children}
      </div>
    );
  }
}

我能做些什么来解决这个问题?

没注意到。你在routes.js中声明了你的路由器,然后在index中声明了另一个路由器,将路由作为prop传递。

我认为你应该修改你的routes.js(你必须导出你的routes const)。

路线:

import App from './app';
import { Router, Route, hashHistory } from 'react-router';
import React from 'react';
const routes = (
   <Router history={hashHistory}>
   <Route path="/" component={App}/>
  </Router>
);
module.exports = routes;

现在你可以把它导入到你的索引中,你应该直接渲染你的路由:

import ReactDOM from 'react-dom';
import React from 'react';
import { Router, hashHistory } from 'react-router';
import routes from './routes';
ReactDOM.render(routes, document.getElementById('app'));

你试过把历史道具在路由器吗?

<Router history={hashHistory}>