React Router 是 React 应用的一个重要库，用于实现单页面应用的路由管理。以下是一些关于 React Router 的基本概念和用法。

基本概念

React Router 提供了三种组件来处理路由：

  • Route：定义路由路径和对应的组件。
  • Switch：类似于 HTML 的 <switch> 元素，用于匹配到第一个匹配的 Route。
  • Link：用于创建导航链接。

使用方法

以下是一个简单的示例：

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

const App = () => (
  <Router>
    <div>
      <nav>
        <ul>
          <li>
            <Link to="/">Home</Link>
          </li>
          <li>
            <Link to="/about">About</Link>
          </li>
        </ul>
      </nav>

      <Switch>
        <Route path="/about">
          <About />
        </Route>
        <Route path="/">
          <Home />
        </Route>
      </Switch>
    </div>
  </Router>
);

const Home = () => (
  <div>
    <h1>Home Page</h1>
  </div>
);

const About = () => (
  <div>
    <h1>About Page</h1>
  </div>
);

export default App;

更多详细信息和教程，请访问我们的React Router 教程。

图片示例

下面展示一个 React Router 的示例图片：

React Router