Javascript Action Creator中的history.push（）将更改URL，但不会导航到页面

我有一个登录页面组件，我想在成功登录后从action creator（thunk）重定向。 它似乎可以工作，但当URL正确更改时，页面仍保留在登录页面上

在这里，我导入要在action creator中导入的历史：

//helpers/history.js
从“历史”导入{createBrowserHistory}；
const history=createBrowserHistory（）；
导出默认历史记录；

以下是操作创建者的简化版本：

//操作/session.js
从“../helpers/history”导入历史记录；
导出常量登录=（formData）=>{
返回（发送）=>{
分派（{type:LOGIN\u REQUEST}）
返回取回（“http://localhost:3001/login", {
...
。然后（（用户）=>{
历史记录。推送（“/live rewards”）
派遣({
类型：登录\请求\成功
})
})
.catch（错误=>{
...

这里是组件的缩短版本，以显示如何调用登录和导入

//containers/LoginForm.js
从“React”导入React，{Component}
从“react redux”导入{connect}；
从“react router dom”导入{Link}
从“../actions/session”导入{login}
类LoginForm扩展组件{
...
fetchOnSubmit=（e）=>{
e、 预防默认值（）
this.props.login（this.state）
}
...
const mapDispatchToProps=调度=>{
返回{
登录：（凭证）=>{
返回调度（登录（凭据））
}
}
}
导出默认连接（mapStateToProps、mapDispatchToProps）（LoginForm）；

以下是browserRouter的实现方式：

//index.js
...
...

//app.js
...
...

我建议您完全抛弃此

历史记录

对象，从

浏览器路由器

上下文中的组件处理导航，而不是通过操作创建者

LoginForm

可以访问上下文

历史记录

prop-through。它可以通过

isLoggedIn

prop-through

MapStateTrops

访问状态中的凭据

LoginForm

的

render（）

方法将包括一个

Redirect

组件，该组件根据

isLoggedIn

属性有条件地呈现，该属性将在

调度
登录请求成功时更新


以某种方式从
状态
映射到
布尔值
prop
isLoggedIn
。示例：

const mapStateToProps = (state) => ({
  isLoggedIn: !!state.credentials.token
})

条件渲染：

{this.props.isLoggedIn && <Redirect to="/live-rewards" />}

{this.props.isLoggedIn&&}


我更喜欢这种方法，因为这意味着如果用户已经登录，则根本无法加载登录页面