反应重定向到另一个页面不起作用[重复]

Posted 2023-02-21

【中文标题】反应重定向到另一个页面不起作用[重复]

【英文标题】：react redirect to another page not working [duplicate]

【发布时间】：2018-04-29 19:29:30

【问题描述】：

我想在成功登录后重定向到主页。我通过搜索但没有找到解决方案。提前致谢

//imported react-router
import  Redirect  from 'react-router';

//main route file
<Router>
  <div>
    <Route exact path = "/" component= App  />
    <Route path = "/home" component= Homepage  />
  </div>
</Router>

//redirect after ajax success
$.ajax(
    type: 'POST',
    url: '/login_participant',
    data: data,
    dataType:'json',
    success:function(data) 
         console.log(data);

         //redirecting home after login successfully
         <Redirect to ="/home" />
    ,
    error:function(err) 
         console.log(err);
    
)

【问题讨论】：

您错误地使用了重定向。它是一个 jsx 标签。它需要在渲染函数中。也停止使用 jquery ajax 并做出反应。这是一个不好的做法。使用 axios 或 fetch 函数进行 ajax 调用。这就是您使用重定向 jsx 标记的方式。 ***.com/questions/43230194/…

【参考方案1】：

<Redirect /> 是一个简单的组件，它需要一些道具并用它做一些事情。它与 react-router 提供的其他组件有合约，所以它必须知道上下文是什么。

如果您想在成功登录后重定向，您要么必须使用react-router-redux（push 操作）或保持状态标志isUserLoggedIn 或类似的方式为您的组件提供数据。两种解决方案都需要使用 redux/flux 或其他状态容器。

如果你不想使用 redux/flux，也许只是替换窗口位置？ （路径名）。

都是我这边，也许其他人有更好的解决方案。

【讨论】：

我是新手。请提供一个完美的解决方案

如果你目前没有使用 redux，这是你项目的重大变化。我可以提供一些解决方案，但我需要更广泛地看待这个问题。你能提供一些你的项目样本吗？如果您不想这样做，我建议使用我提到的标准 javascript API 重定向用户 - 以替换窗口位置。更改为 1 行，没有大的变化。只需将您的<Redirect /> 替换为window.location = 'your_successful_login_location，或者如果它是同一来源，则可能只是window.location.pathname = 'your_pathaneme';

window.location 不适合我

试试window.location.pathname = '/home';（在你的情况下）

这也不行