Question

我正在尝试使用Electron + React开发桌面应用。我正在使用electron-react-boilerplate。

我在routes.js中定义了我的路由并引用了该组件，但在开发过程中，当我点击它时，它无法呈现页面。

routes.js

import React from 'react';
import { HashRouter as Router } from 'react-router-dom';
import { Switch, Route } from 'react-router';
import App from './containers/App';
import HomePage from './containers/HomePage';
import PersonFind from './containers/PersonFind';

export default () => (
  <Router>
    <App>
      <Switch>
        <Route path="/" component={HomePage} />
        <Route path="/identify" component={PersonFind} />
      </Switch>
    </App>
  </Router>
);

PersonFind.js

import React, { Component } from 'react';
import Header from '../components/Header';


class PersonFind extends Component {
  render() {
    return (
      <div>
        <Header />
        <h1> Works </h1>
      </div>
    );
  }
}
export default PersonFind;

Answer 1

在索引路线中使用exact。

<Route exact path="/" component={HomePage} />

/identify与/和/identify匹配。由于这两条路线位于<Switch>内，因此只有第一条（HomePage）被渲染。

使用电子时，React Router不会渲染组件

1 个答案: