解决 REST 请求后如何重定向用户

Posted 2023-02-21

【中文标题】解决 REST 请求后如何重定向用户

【英文标题】：How can I redirect the user after REST request is resolved

【发布时间】：2020-01-23 13:35:09

【问题描述】：

如果登录成功，我会尝试将用户重定向到个人资料页面。

我尝试过使用 React 路由器重定向：

signInWithEmailAndPassword = (username, password) => 
  return new Promise((resolve, reject) => 
    axios.post(process.env.REACT_APP_BACK_END_DOMAIN + urls.LOGIN, 
      username,
      password,
    ,
    
      headers: 
        'X-CSRFTOKEN': Cookies.get("csrftoken"),
      
    ).then(response => 
        console.log(response);
        if(response.status =='200')
          return <Redirect to='/profile' />
        
    );
  );
;

但是当登录成功时，什么也没有发生。

我不知道我做错了什么。

【问题讨论】：

console.log 显示了什么？

不重要，console.log中的状态码为200，后台登录成功。

替代Redirect 试试this.props.history.push('/profile')。

What is the best way to redirect a page using React Router?的可能重复

【参考方案1】：

如果您使用的是 React Router 4，那么您需要在历史对象上使用 push 方法或在渲染函数中编写

import history from '../history';

history.push('/profile');

【参考方案2】：

我通过以下方式实现了这一点。

1) 取一个像this.state = redirectStatus : false这样的状态值

2）当您检查状态码时，将状态设置为true，就像this.setState(redirectStatus :true)（如果状态码是200）

3) 最后你可以在承诺之外做一些这样的事情

if(redirectStatus ) 
return <Redirect to='/profile' />

【讨论】：

该组件中没有状态，它纯粹是功能性的

@octa 你可以使用钩子来达到同样的效果，忘了说。