reactjs - 我可以保证在表单提交之前状态已经改变吗?
问题描述
根据用户是“批准”还是“拒绝”,需要不同的提交回调。因此,我根据用户单击的内容将状态变量“submitCallBack”设置为相关函数。我的问题是,我可以保证在提交完成之前设置 submitCallBack 或重新渲染吗?(因为 setState 是异步的)
这目前正在按“预期”工作,但想确保我在发布时不会遇到问题
我想要发生的事件顺序:
- 用户点击按钮
- this.handleSubmit() 通过回调调用
- submitCallBack 已设置并且表单重新呈现
- 提交事件发生并且使用正确的回调设置了 handleSubmit
class FormClass extends React.Component {
constructor(props) {
super(props)
this.state = {
submitCallBack: () => {}
}
}
handleSubmit = callback => () => {
// this needs to be set before the submit completes and the forms callback function
// for onSubmit must be set to this new value
this.setState({ submitCallBack: callback })
}
render() {
const { error, invalid, submitting, handleSubmit, approve, decline } = this.props
return (
<form onSubmit={handleSubmit(this.state.submitCallBack)}>
<Button
type="submit"
onClick={this.handleSubmit(approve)}
primary
action
loading={submitting}
>
Approve
</Button>
<Button type="submit" onClick={this.handleSubmit(decline)}>
Reject
</Button>
</div>
</form>
)
}
}
解决方案
推荐阅读
- r - 更改闪亮应用的直方图颜色
- postgresql - 当我已经遵循格式时,为什么我不能删除 Postgresql-Pgadmin 中的一行?
- installation - 在 laravel 5.4 中安装 guzzle
- sql - 为 SQL Server 中的列中的每个值计算冗余
- python - 由 Pyinstaller 创建的 .exe 在执行乘法矩阵时关闭
- python-3.x - 我在 python 密码学中不断收到 Invalid Token 错误(cryptography.fernet.InvalidToken)
- python - Scrapy 中意外的速度波动与节流有何关系?
- c - c中的指针值
- postgresql - ThingsBoard Docker容器部署导致`PSQLException`
- excel - 是否可以根据 Excel 中的计算度量进行条件格式设置?