react路由跳转新页面

你可以使用React Router库来实现React应用中的页面跳转。首先，你需要安装React Router库：

npm install react-router-dom

然后，在你的应用中引入所需的组件：

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

接下来，你可以使用`Router`组件将你的应用包裹起来，并定义你的路由规则：

function App() {
  return (
    <Router>
      <Switch>
        <Route exact path="/" component={Home} />
        <Route path="/about" component={About} />
      </Switch>
    </Router>
  );
}

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

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

在上面的例子中，我们定义了两个路由规则：`/`对应`Home`组件，`/about`对应`About`组件。

然后，你可以在你的应用中使用`Link`组件来创建导航链接，以实现页面跳转：

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

      <Switch>
        <Route exact path="/" component={Home} />
        <Route path="/about" component={About} />
      </Switch>
    </Router>
  );
}

在上面的例子中，我们创建了两个导航链接：`Home`和`About`，点击链接时会导航到对应的页面。

这就是使用React Router进行页面跳转的基本步骤。你可以根据需要添加更多的路由规则和导航链接来实现复杂的页面跳转逻辑。