如何在react中为多页应用程序创建路由

npm install react-router-dom

// index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Home from './pages/Home';
import About from './pages/About';
import Contact from './pages/Contact';

ReactDOM.render(
  <Router>
    <Switch>
      <Route exact path="/" component={Home} />
      <Route path="/about" component={About} />
      <Route path="/contact" component={Contact} />
    </Switch>
  </Router>,
  document.getElementById('root')
);

// pages/Home.js
import React from 'react';

function Home() {
  return <h2>Home Page</h2>;
}

export default Home;

// pages/About.js
import React from 'react';

function About() {
  return <h2>About Page</h2>;
}

export default About;

// pages/Contact.js
import React from 'react';

function Contact() {
  return <h2>Contact Page</h2>;
}

export default Contact;