NLRX-WJC / react-antd-admin-template

一个基于React+Antd的后台管理模版,在线预览https://nlrx-wjc.github.io/react-antd-admin-template/
MIT License
2.06k stars 510 forks source link

登录成功后跳转首页的逻辑是什么 #17

Open RichardZhang12 opened 3 years ago

RichardZhang12 commented 3 years ago

你好,我碰见一些情况,请教一下。

问题:研究代码,login页面,点击登录按钮,先获取token-->获取用户信息,但是获取成功之后没有看到进行路由跳转的代码。我本地调试看到了点击登录按钮成功后,login组件进行了重新渲染,token存在,所以返回,但是为什么点击登录后,login组件会重新渲染呢,

drinkjava2 commented 2 years ago

我正好也在学习这个,多打些断点就明白了,简单记录一下我的分析: 登录按钮后依次调用: handleSubmit -> handleLogin(username, password) -> login(username, password) -> dispatch(setUserToken(token)); dispach了一个types.USER_SET_USER_TOKEN类型的action, 造成reducer里的对应action执行了,结果就是state里的user变量被改变了,react就从最顶层重新开始刷新,因为当前页面还是/login,所以继续执行 这个路由,然后还是在Login函数里碰到

if (token) {
     return <Redirect to="/dashboard" />;
  }

这时因为user.token有值了,所以会跳转到/dashboard路由上,重新刷新就跑到 <Route path="/" 。。。>这个路由里去了,也就是去加载Layout了, 至此登录过程完成。