reactjs - 如何通过 Axios Post 方法将成功消息传递给另一个组件
问题描述
当我通过 Axios POST 方法注册新用户时,我试图将成功消息传递给我的仪表板组件。我能够通过仪表板组件中的控制台日志传递我的用户数据,但是,我似乎无法正确设置状态并在成功注册时传递自定义成功消息。任何帮助都感激不尽。
我已经能够控制台记录 userData 对象,但我在设置状态和传递自定义消息方面没有成功。
***** 这是我将 axios 发布到 API 的代码,设置状态导致“未处理的拒绝(TypeError):无法在我的单独仪表板组件中读取未定义的属性“数据”。
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
})
);
};
***** 这是 Dashboard 组件代码,用于接收状态并显示成功消息。
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>
);
}
解决方案
推荐阅读
- angular - 如何为角度 4 反应形式中的“非必需”字段添加用于检查电子邮件的自定义验证是否已存在或不存在
- javascript - 在Angularjs中,我们可以在ng-repeat中删除或忽略列名中的大小写敏感吗
- typescript - TypeScript:从枚举类型推断枚举值类型
- javascript - Javascript无法在移动设备上运行
- android - 将数据从 arduino 发送到菜单 SearchView
- java - 当JVM达到Java中的最大线程数时,每个线程的最小内存分配?
- django - Django rest IntegrityError:1048,外键序列化程序上的“列不能为空”
- count - 计算具有相同信息的不同列中的出现次数
- android - 如何使用改造解析动态键响应
- linux - 如何在 GitLab 中使用接收后挂钩获取用户输入?