React select with value null. When setting the value for your select component, you will have to convert null to ”; and when receiving the value from your component, you will have to convert ” to null.
Here is a simple example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | class Example extends React.Component { constructor(props) { super(props); this.state = { selected: null }; } render() { return <div> <select className="input form-control" onChange={e => this.setState({ selected: e.target.value || null })} value={this.state.selected || ''}> <option value=''></option> <option value='1'>cook dinner</option> <option value='2'>do dishes</option> <option value='3'>walk dog</option> </select> <input type='button' onClick={() => this.setState({ selected: null })} value='Reset' /> </div> } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.