Get Value From Select -- React

I tried some thing for display value from select tag. The first thing I tried, is event.target.value with an onChange. The second thing I tried is event.nativeEvent.value IMPOSS

Solution 1:

Change your onChange to this.

onChange={this._handleChange}

Also another handleChange method you could try

handleChange(e) {
let {name, value} = e.target;
this.setState({
  [name]: value,

});

}

Solution 2:

importReact, { Component } from'react';

exportdefaultclassAppextendsComponent {

  constructor(props) {
    super(props);
    this.state = {
      value: 'a'
    }
  }

  _handleChange = (event) => {
    this.setState({ value: event.target.value })
  }

  render() {
    return (
      <divclassName="container"><divclassName="list-container"><divclassName="list-select"><selectonChange={this._handleChange}className="ant-input selectBox"style={{width:200 }}
              placeholder="Select a person"ref={ref => {
                this._select = ref
              }}
              defaultValue={this.state.value}
            >
              <optionvalue="a">A</option><optionvalue="b">B</option>
              ...
            </select></div></div></div>
    );
  }
}

You shouldn't invoke the _handleChange in the onChange handler. It is bad practice to include both

value={this.state.value}
defaultValue={this.state.value}

in a dropdown in React. You either supply one of the two but not both.

If you intend to use that handler for multiple inputs, then you should consider doing this instead.

_handleChange = ({ target: { name, value } }) => {
    this.setState({ [name]: value })
}