Reactjs 从外部链路响应路由

我正在尝试实现ForgetPassword组件。我的应用程序路由：

  const {user} = useSelector(state => state.user)
  return( 
    <Switch>
      <Route exact path={'/app/login'} component={Login} />
      <Route exact path={'/app/forget'} component={ForgetPassword} />
      <Route exact path={'/api/auth/password/reset/:id/:token/'} component={ResetPassword} />
      {user ? (<>
        <Switch>
          <Route exact path={'/app/profile'} component={Profile} />
          <Route exact path={'/app/bar'} component={Bar} />
          {user && (<Redirect exact from='/' to='/app/bar' />)}
        </Switch>
      </>) : <Redirect to='/app/login' />}
    </Switch>
  )

const{user}=useSelector（state=>state.user）
报税表（
{用户(
{user&&（）}
) : }
)

组件ResetPassword使用useParams从url获取参数，这是重置密码过程所需的参数。当您发送电子邮件时，您将获得密码重置链接。链接看起来像：

我正在使用react路由器dom 5.1

预期行为： 单击重置链接后，应用程序应重定向到带有参数的重置密码组件

当前行为： 单击链接后，它将重定向到“/app/login”

我试着改变路径，但没有准确的答案。它不起作用。仅当我将部件api/auth/password/reset/MzY/5ec-61a27a7043e37320bfd1/粘贴到本地主机时，它才起作用。在服务器上，它重定向到/app/login

---

如何使用react router dom处理它？

解决方案是询问您的后端开发人员是否将您的链接重定向到另一个，在您的邮件中单击api中的链接后，它将重定向到app/password/reset这样的链接：id={id}&token={token}。（取决于后端）

显示所需的重置密码

以及您可以从

react router dom

hook useLocation获得的id和令牌

const{search}=useLocation（）

使用

querystring

将有助于获取具有id和令牌的对象

const parsed = queryString.parse(search.slice(1))
const {id, token} = parsed

切片是否有助于消除问号？从链接

我希望它能帮助别人。 答案就是从这个线索中得到启发的