一、什么是React History
React History 是 React 官方提供的一款路由管理工具,主要用于幫助 React 應(yīng)用實(shí)現(xiàn)路由跳轉(zhuǎn)和管理。
相較于 React 自帶的路由功能,React History 更為簡介,易于上手。它提供了豐富的路由管理 API,可以讓我們在項(xiàng)目中更加靈活地使用路由。
二、React History的使用
在 React 項(xiàng)目中使用 React History 非常簡單,只需按照以下步驟即可:
// 使用 npm npm install --save history // 使用 yarn yarn add history
import React from 'react';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import Home from './Home';
import About from './About';
function App() {
return (
上述代碼通過創(chuàng)建 BrowserRouter,為項(xiàng)目添加了兩個路由:"/"和"/about"。當(dāng)用戶訪問這兩個路由時,對應(yīng)的組件將會被渲染。
import React from 'react'; import { Link } from 'react-router-dom'; function Navigation() { return ( ); } export default Navigation;
上述代碼通過創(chuàng)建 Link 組件,為項(xiàng)目添加了兩個路由鏈接:"/"和"/about"。
import React from 'react'; import { useHistory } from 'react-router-dom'; function Home() { const history = useHistory(); function handleClick() { history.push('/about'); } return (
Home