我在另一个组件中使用反应最终形式,比如说对话框div,我想在关闭此对话框div之前检查此表单是否已更改(以显示消息,例如'您有未保存的更改')。
这是一个例子,我不知道如何在最终形式的更改中调用onChange - 在标签中,如果我使用一些自定义输入,它将无法工作,而在验证方法中,它看起来太脏了。
class Dialog extends Component {
...
onFormChange = () => this.setState({isFormChanged: true})
close() {
if (this.isFormChanged){
this.showDialog()
} else {
//close dialog
}
}
render(){
return <div>
<MyForm onChange={this.onFormChange} />
</div>
}
}
和表格
function MyForm({ saveData, onChange, ...props }) {
return <div>
<Form
onSubmit={saveData}}
render={({
handleSubmit,
}) => (
<form onSubmit={handleSubmit} onChange={() => onChange()}>
</form>
答案 0 :(得分:1)
尝试查看<FormSpy>
辅助组件,它是onChange
道具:https://github.com/final-form/react-final-form#formspyprops