Question

我有一个React应用程序，该应用程序托管在另一个管理身份验证的应用程序中。

在我的应用程序中，我可以通过Web服务查看用户是否通过了身份验证。

我想做的是如果用户未通过身份验证，将用户重定向到主应用程序。

我的主页类似于：“ / BigApp / MyApp”

我想将用户重定向到“ / BigApp”

将处理身份验证。

BigApp不是MyApp的一部分，它仅具有指向MyApp的链接。

我已经尝试过使用重定向，并尝试将其提升一级。

据我了解，重定向仅适用于您指定了路线的组件。

import { Redirect } from 'react-router-dom'
...
<Redirect to='../' />

重定向时，它会保留在相同的网址“ / BigApp / MyApp”中

有什么方法可以使用React Router做到这一点吗？

Answer 1

不幸的是，<Redirect>中不支持重定向到外部URL。

您尝试的方法无效，因为路由不适用于文件夹。另一点是，由于react-router仅适用于给定的一组路由（如您所说），因此它不能从“框外”使用。

您可以使用window.location.assign()方法，该方法将页面重定向到作为参数传递的给定URL。

以下代码段：

const App = () => {
  return <button onClick={() => {window.location.assign("https://stackoverflow.com")}}>Click Here to Redirect</button>
}

ReactDOM.render(<App />, document.getElementById("root"))

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>

React.js重定向到我的路线和主页之外的链接

1 个答案: