javascript - 使用 React 和 Electron - react 路由器错误

Question

我刚开始学习如何使用 Electron 制作桌面应用程序我正在尝试使用 react-router使用 Electron 但我不断收到错误警告:[react-router] 位置“/”不匹配任何路由

ma​​in.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>
    );
  }
}

我该怎么做才能解决这个问题？

Answer 1

没注意。您在 routes.js 中声明您的路由器，然后在索引中声明另一个路由器将路由作为 prop 传递。

我认为你应该更改你的 routes.js(你必须导出你的路由常量)。

路线:

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'));