在 React 中实现页面跳转通常使用几种方式：
- 使用 React Router
React Router 是 React 官方推荐的路由库，它提供了一些组件，用于管理应用程序的不同页面之间的导航。使用 React Router 可以通过编写简单的代码来实现页面跳转。
在 React 中使用 React Router 步骤如下：
（1）安装 React Router：
npm install react-router-dom
（2）在组件中导入库：
import { BrowserRouter as Router, Route } from 'react-router-dom';
（3）使用 <Router> 组件包裹应用程序，并使用 <Route> 组件定义每个页面的路由。
示例：
import React from 'react'; import { BrowserRouter as Router, Route } from 'react-router-dom'; import Home from './Home'; import About from './About'; function App() { return ( <Router> <div> <Route exact path="/" component={Home} /> <Route path="/about" component={About} /> </div> </Router> ); } export default App;
- 使用 window.location.href
使用 window.location.href 可以实现在 React 中的页面跳转，但它不是推荐的做法，因为它会刷新整个页面，而不是单独更新组件。如果您只是需要简单地从一个页面跳转到另一个页面，可以使用以下代码：
window.location.href = 'https://example.com';
- 使用 Link 组件
React Router 中的 Link 组件提供了一种不刷新整个页面的跳转方式。Link 组件提供了一个类似于 <a> 元素的接口，但它不会导致整个页面的刷新。
示例：
import React from 'react'; import { Link } from 'react-router-dom'; function Navbar() { return ( <ul> <li> <Link to="/">Home</Link> </li> <li> <Link to="/about">About</Link> </li> </ul> ); } export default Navbar;
