如果最终形式的反应在形式之外触及状态,是否有任何方法可以得到

时间:2018-01-24 12:33:30

标签: reactjs react-final-form final-form

我在另一个组件中使用反应最终形式,比如说对话框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>

1 个答案:

答案 0 :(得分:1)

尝试查看<FormSpy>辅助组件,它是onChange道具:https://github.com/final-form/react-final-form#formspyprops