How do I clear my input that has value in it?

I have an input that’s populated with values returned from an API that’s stored into Redux state:

state = {
  popoverScenarioName: null,

scenarioNameChange = (e) => (

// ....

  placeholder="Scenario Name"
  onChange={(e) => scenarioNameChange(e)}
  onFocus={(e) =>}
  value={this.state.scenarioName || database.inputs.scenarioName}

When I click into the input and hit backspace to clear the entire field, it always repopulates the value with database.inputs.scenarioName.

I’ve tried setting state to something like

state = {
  popoverScenarioName: null || this.props.database.inputs.scenarioName,

but that didn’t seem to work neither. My other guess would be to write a dispatch to change database.inputs.scenarioName directly?


I achieved it with this prop:

scenarioName={this.state.popoverScenarioName === null ? database.inputs.scenarioName : this.state.popoverScenarioName}

Leave a Reply

Your email address will not be published. Required fields are marked *