在反应js中从一个本地主机导航到另一个本地主机

Question

如何在 React Js 中从一个 localHost:3000 导航到 localHost:3001 目前我的身份验证是 localHost:3000 中的 运行，我想在登录成功时将其导航到 localHost:3001

我目前的实现就像 {agency && <Navigate to={"http://localhost:3001/"} replace />}

但它将我导航到 http://localhost:3000/Login/localhost:3001/

但我想要 http://localhost:3001

有人吗？

Answer 1

您需要使用

window.location.href = 'http://localhost:3001/'

或采用良好做法

const redirectToExternalResource = url => window.location.href = URL

redirectToExternalResource('http://localhost:3001/')

Answer 2

react-router-dom 仅处理内部导航操作，即它只能 link 到 React 应用程序并在其中路由。 "http://localhost:3001/" 被解释为内部路径并附加到当前路径。

如果您需要导航到外部（到应用程序）URL，您应该使用原始锚点 (<a />) 标签或通过 window.location 对象发出命令式重定向。

创建一个新的导航组件来处理在 useEffect 挂钩中发出 side-effect 外部重定向。

示例：

const NavigateExternal = ({ to }) => {
  useEffect(() => {
    window.location.href = to;
  }, []);
  return null;
};

...

{agency && <NavigateExternal to="http://localhost:3001/" />}