如何通过Axios Post方法将成功消息传递到另一个组件

时间:2019-05-03 00:24:14

标签: reactjs axios

当我通过Axios POST方法注册新用户时,我试图将成功消息传递给仪表板组件。我能够通过仪表板组件中的控制台日志传递用户数据,但是,似乎无法正确设置状态并在成功注册时传递自定义成功消息。任何帮助将不胜感激。

我已经能够控制台记录userData对象,但是在设置状态和传递自定义消息方面一直没有成功。

*****这是我的代码,用于将axios帖子运行到API,并且设置状态导致“未处理的拒绝(TypeError):无法读取我单独的仪表板组件中的属性'data'of undefined'。

    export const adminRegisterUser = (userData, history) => dispatch => {
      axios
       .post("/api/users/adminregister", userData)
       .then(res => {
          history.push("/dashboard")
          this.setState({ message: "Message sent successfully." });
       }) // Re-direct to dashboard on successful register and push a message confirming the registration.
        .catch(err =>
          dispatch({
          type: GET_ERRORS,
          payload: err.response.data
       })
      );
    };

*****这是仪表板组件代码,用于接收状态并显示成功消息。

     render() {
        return (
           <div style={{ width: "100%", backgroundColor: "#fff" }}className="valign-wrapper">
           <LoginNav />

           // Note that a console.log(userData) will output the userData here
           <div>{this.state.message}</div>
           <div className="row">
            <div className="col s6">
              <Chart />
            </div>
            <div className="col s6">
              <LineChart />
            </div>
           </div>
          </div>
        );
       }

0 个答案:

没有答案