我正在尝试在react-router redux app中实现登录功能。
以下是方案
用户登录并将其重定向到其信息中心。
为此,当此人输入ID / pass并按下提交并在API调用成功时,我将browserHistory替换为/ app / dashboard。到现在为止还挺好。
用户可以选择信息中心内的子部分
所以现在他可以选择仪表板下的子页面并转到/ app / dashboard /:页面,一切正常。
现在说如果他在这里重新加载页面,它会被重定向到/ app / dashboard。这主要是因为在我的挂载点上,我的应用程序组件(/ app)正在调度初始身份验证的操作。
此操作会检查用户是否已登录(我从Cookie跟踪)。如果他是,他被重定向到仪表板,否则他将被带到登录页面。
当我重新加载/ app / dashboard /:页面时,它需要我/ app / dashboard,因为这个initAuth()操作是在App Component上发送的。
为了解决这个问题,我使用了组件下道具的位置。
这需要2个场景。
情景1
当我解雇initAuth()
时,我会从pathname
传递location
作为参数。如果是登录,我会重定向到主页,否则我就离开了。
场景2
同样,当我登录时,我从ownProps
读取mapDispatchToProps
并检查路径名是否登录,我将其重定向到/app/dashboard
。
这种方式只有当用户来自登录时才会被重定向到仪表板,其他页面不会被重定向到仪表板。
所以我创建了一个处理上述场景的函数
if(path === constants.LOGIN_URL_PATHANAME){
browserHistory.replace(constants.DASHBOARD_URL_PATHNAME)
}
所以虽然我实现了这个,但我认为可以有更好的解决方案来处理这个问题。你能否分享一下你的反馈意见?