'React useForm equivalent in class component
I moved a functional component to class component recently and don't find the equivalent of useForm when using a class.
Here is the code I used before:
var commentField = form.getState()["active"].replace(new RegExp("parameter_info$"), "comment");
form.change(commentField, result.comment);
With this, I was able to link two dynamicaly generated inputs.
How can I do it using a class?
Solution 1:[1]
FinalForm docs says useForm() is used internally inside useField(), <Field/>, and <FormSpy/>., so it's possible to write equivalent code using FormSpy:
class Updater extends React.Component {
componentWillReceiveProps(nextProps) {
var commentField = this.props.form.getState()["active"].replace(new RegExp("parameter_info$"), "comment");
this.props.form.change(commentField, result.comment);
}
render() {
return null;
}
}
You need to render <FormSpy subscription={{ values: true }} component={Updater} /> somewhere in your form to make it work.
Note that you can use final-form-calculate package to implement calculations between fields.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Evgeny Timoshenko |
