如何在说 localhost:3000/home 而不是 localhost:3000 加载反应应用程序？

Question

如上所述，如何在开始时在 localhost:3000/home 而不是 localhost:3000 加载我的应用程序。我通常只是在控制台中运行 npm start 。

Answer 1

您可以使用react-router-dom.

这是一个工作示例：https : //stackblitz.com/edit/react-router-starter-w1in3e?file=index.js

请参阅以下示例：

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter as Router, Route, Link, Redirect } from 'react-router-dom';

import About from './components/About';
import Home from './components/Home';
import Topics from './components/Topics';

const BasicExample = () => (
  <Router>
    <div>
      <ul>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/about">About</Link></li>
        <li><Link to="/topics">Topics</Link></li>
      </ul>

      <hr />

      <Route exact path="/" component={() => (<Redirect to='/home' />)} />
      <Route exact path="/home" component={Home} />
      <Route path="/about" component={About} />
      <Route path="/topics" component={Topics} />
    </div>
  </Router>
);

render(<BasicExample />, document.getElementById('root'));