React - Router的基本使用介绍

import React from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';
 
// 定义一个组件来代表每一个路由
const Home = () => <h2>Home</h2>;
const About = () => <h2>About</h2>;
const Users = () => <h2>Users</h2>;
 
// 这是一个路由配置的例子
const BasicExample = () => (
  <Router>
    <div>
      <ul>
        <li>
          <Link to="/">Home</Link>
        </li>
        <li>
          <Link to="/about/">About</Link>
        </li>
        <li>
          <Link to="/users/">Users</Link>
        </li>
      </ul>
 
      {/* 路由匹配时渲染的组件 */}
      <hr />
      <Route exact path="/" component={Home} />
      <Route path="/about/" component={About} />
      <Route path="/users/" component={Users} />
    </div>
  </Router>
);
 
export default BasicExample;

这段代码展示了如何使用React Router的BrowserRouter来设置应用的路由。它定义了三个简单的组件Home、About和Users，并通过Route组件配置了相应的路由。Link组件用于在应用中创建导航链接。这是学习React应用路由管理的一个基本例子。