Reactjs Redux和React:未处理的拒绝(TypeError):无法读取属性';推动';未定义的

Reactjs Redux和React:未处理的拒绝(TypeError):无法读取属性';推动';未定义的,reactjs,redux,react-redux,react-router,axios,Reactjs,Redux,React Redux,React Router,Axios,在Redux操作文件代码中,我试图在用户成功登录时实现history.push('/userfeed')。但是,我一直收到以下错误:未处理的拒绝(TypeError):无法读取未定义的属性“push”。在分派之前,我在我的操作文件中记录了历史记录,它显示为“未定义”。任何帮助都将不胜感激 //重排操作文件 export const login = ({email, password, history}) => dispatch =>{ //Headers const conf

在Redux操作文件代码中,我试图在用户成功登录时实现history.push('/userfeed')。但是,我一直收到以下错误:未处理的拒绝(TypeError):无法读取未定义的属性“push”。在分派之前,我在我的操作文件中记录了历史记录,它显示为“未定义”。任何帮助都将不胜感激

//重排操作文件

export const login = ({email, password, history}) => dispatch =>{
  //Headers
  const config = {
    headers:{
      "Content-Type": "application/json"
    }
  };

  //Request data body to send
  const body = JSON.stringify({email, password});

  axios.post('/api/user/login/', body, config)
    .then(res => {
      dispatch({
      type: LOGIN_SUCCESS,
      payload: res.data
    })
    history.push('/userfeed')
  })
};
//React登录组件文件

class LoginPage extends Component{

  state = {
    email: '',
    password: '',
    msg: null
  };

  handleChange = (event) =>{
    this.setState({
      [event.target.name]:event.target.value
    });
  }

  static propTypes = {
    isAuthenticated: PropTypes.bool,
    error: PropTypes.object.isRequired,
    login: PropTypes.func.isRequired,
    clearErrors: PropTypes.func.isRequired

  };

  componentDidUpdate(prevProps){

    const { error } = this.props;
    if(error !== prevProps.error){
      //Check for login error
      if(error.id === 'LOGIN_FAIL'){
        this.setState({
          msg: error.message
        })
      }else{
        //If not login fail error then set msg to null
        this.setState({
          msg: null
        })
      }
    }
  }

handleSubmit = (e) =>{
  e.preventDefault();
  const { email, password } = this.state;

  const user = {
    email,
    password
  }

  //Attempt to login
  this.props.login(user, this.props.history);
  this.props.clearErrors();

}

    render(){
      return(
      <div className="LoginPage">
        <div className="loginOuterContainer">
                <form name="form" onSubmit={this.handleSubmit}>
                    <div className="emailLabelInput">
                        <input type="text" className="login-form-control" name="email" placeholder="Email address" onChange={this.handleChange}/>

                    </div>
                    <div className="passwordLabelInput">
                        <input type="password" className="login-form-control" name="password" placeholder="Password" onChange={this.handleChange}/>
                    </div>
                    <div className="form-group">
                        <button className="login-btn">Log in</button>

                    </div>
                </form>
            </div>
          </div>
      )
    }
};

const mapStateToProps = state => ({
  isAuthenticated: state.auth.isAuthenticated,
  error: state.error
});
export default connect(mapStateToProps, {login, clearErrors})(LoginPage);
类登录页扩展组件{
状态={
电子邮件:“”,
密码:“”,
msg:null
};
handleChange=(事件)=>{
这是我的国家({
[event.target.name]:event.target.value
});
}
静态类型={
已验证:PropTypes.bool,
错误:PropTypes.object.isRequired,
登录名:PropTypes.func.isRequired,
clearErrors:PropTypes.func.isRequired
};
componentDidUpdate(prevProps){
const{error}=this.props;
if(错误!==prevProps.error){
//检查登录错误
如果(error.id==='LOGIN\u FAIL'){
这是我的国家({
msg:error.message
})
}否则{
//如果没有登录失败错误,则将msg设置为null
这是我的国家({
msg:null
})
}
}
}
handleSubmit=(e)=>{
e、 预防默认值();
const{email,password}=this.state;
常量用户={
电子邮件,
密码
}
//尝试登录
this.props.login(用户,this.props.history);
this.props.clearErrors();
}
render(){
返回(
登录
)
}
};
常量mapStateToProps=状态=>({
isAuthenticated:state.auth.isAuthenticated,
错误:state.error
});
导出默认连接(MapStateTops,{login,clearErrors})(LoginPage);
//App.js文件

class App extends Component{
  componentDidMount(){
    store.dispatch(loadUser());
  }
  render(){
  return(
  <Provider store={store}>
  <div className="App">
    <Router>
      <Switch>
        <Route exact path="/login" component={LoginPage}/>
        <Route exact path="/userfeed" component={UserFeed}/>
      </Switch>
    </Router>
  </div>
  </Provider>
);
}
};
export default App;
类应用程序扩展组件{
componentDidMount(){
store.dispatch(loadUser());
}
render(){
返回(
);
}
};
导出默认应用程序;

您的
登录
函数期望对象上有
历史
属性,但您这样调用它:

this.props.login(用户,this.props.history);
应该是

this.props.login({user,password,history:this.props.history});

是的,就是这样!另外,我需要添加的不是用户,而是电子邮件和密码。我认为你的回答是正确的。非常感谢你!