Hi Carlos! I tried to follow your example for input but when call onChange the input lose focus. Do you know what is happening ?
My code:
export const withFormField = mapProps(
(props) => ({
value: props.value,
onChange: props.onChange,
onFocus: props.onFocus,
onBlur: props.onBlur,
errorText: props.error,
})
);
export const SimpleInput = (props) => (
<div>
<input
type=”text”
value={props.value}
onChange={props.onChange}
onBlur={props.onBlur}
autoFocus={props.autoFocus}
/>
{ props.errorText && <span>{ props.errorText }</span> }
</div>
);
— — — -
class App extends Component {
constructor() {
super();
this.state = { inputValue: ‘’ };
}
changeInputValue = (value) => {
this.setState({ inputValue: value });
}
render() {
const InputWithFormField = withFormField(SimpleInput);
return (
<div className=”App”>
<InputWithFormField
onChange={e => this.changeInputValue(e.target.value)}
value={this.state.inputValue}
errorText=”Error”
/>
</div>
);
}
}
