Updating a React Input text field with the value on onBlur event

Question

I have the following input field as below. On blur, the function calls a service to update the input value to the server, and once that\'s complete, it updates the input field.

Answer 1

In order to have the input value editable you need to have an onChange handler for it that updates the value. and since you want to call a function onBlur, you have to bind that like onBlur={() => this.props.actions.updateInput()}

componentDidMount() {
   this.setState({inputValue: this.props.inputValue});
}
handleChange = (e) => {
  this.setState({inputValue: e.target.value});
}

 this.props.actions.updateInput(this.state.inputValue)} />