react-router-dom v6使用useNavigate跳转

DEMO:

import { useNavigate } from 'react-router-dom';
const Home = () => {
    const navigate = useNavigate()
    const goToPath = () => {
        navigate('/user');
    }
    return (
        <div>
            <div onClick={goToPath}>去个人中心</div>
        </div>            
    )
}
export default Home;

navigate(path,{replace: true}) 路由跳转,清除历史记录

navigate('/login',{replace: true})

navigate(num) 路由跳转,前进、后退

// 历史记录 前进
navigate(1)
// 历史记录 后退
navigate(-1)
// 历史记录 后退两步
navigate(-2)
相关推荐