react-router-dom如何做到路由切换而不刷新整个页面，如何配置路由，举个例子

React Router 是一个强大而灵活的路由库，可以帮助我们在 React 应用中管理路由。react-router-dom 是 React Router 库针对 Web 应用开发的封装。

React Router 使用了 HTML5 的 history API，可以在不刷新整个页面的情况下切换路由。这是因为 React Router 通过监听浏览器 URL 的变化来判断要渲染哪个组件。

以下是一个使用 React Router 的例子：

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

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

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

function Users() {
  return (
    <div>
      <h2>Users</h2>
    </div>
  );
}

function App() {
  return (
    <Router>
      <div>
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
            <li>
              <Link to="/users">Users</Link>
            </li>
          </ul>
        </nav>

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

export default App;

在上面的代码中，我们使用了 `BrowserRouter` 组件来包裹整个应用，并定义了三个页面组件 `Home`、`About` 和 `Users`。我们使用 `Link` 组件来定义导航栏链接，使用 `Route` 组件来定义路由匹配规则。

当用户点击链接时，React Router 会自动更新 URL 并匹配对应的路由，然后渲染对应的组件，而不会刷新整个页面。