重定向 react-router-dom v6答案

【问题标题】：Redirect react-router-dom v6重定向 react-router-dom v6
【发布时间】：2022-06-24 10:47:42
【问题描述】：

我有一个问题，在 youtube 上观看一个使用 history.push('/login?redirect=shipping') 的视频，我如何使用 navigate 对其进行修改，因为如果我使用字符串 navigate ('/ login?redirect=shipping') 即使登录它也会返回主页并且不会转到发货页面。

我是这样解决问题的：

 const checkoutHandler = () => {
       if(!userInfo){
          navigate('/login')
       } else{
          navigate('/shipping')
       }
    }

【问题讨论】：

你问的是如何实现app/routing认证？您能否与我们分享您想要或正在尝试做的事情的minimal, complete, and reproducible code example？
添加样本codesandbox.io
请分享Login（或任何路由）组件是如何处理这个重定向目标试图导航回来的。

标签： reactjs react-redux react-router-dom

【解决方案1】：

**试试这个。

const navigate = useNavigate()
const checkoutHandler = () => {
    navigate('/signin?redirect=/shipping')
}

【讨论】：

【解决方案2】：

你有没有解决这个问题？如果您遇到同样的问题，那么我建议您进入您的登录页面并进行一些更改。

导入useHistory和useLocation：

import { Link, useHistory, useLocation } from 'react-router-dom'

然后在函数中应用这个：

const history = useHistory();
const location = useLocation();

【讨论】：