get value from select -- REACT
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,
});
}
import React, { Component } from 'react';
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
value: 'a'
}
}
_handleChange = (event) => {
this.setState({ value: event.target.value })
}
render() {
return (
<div className="container">
<div className="list-container">
<div className="list-select">
<select
onChange={this._handleChange}
className="ant-input selectBox"
style={{ width: 200 }}
placeholder="Select a person"
ref={ref => {
this._select = ref
}}
defaultValue={this.state.value}
>
<option value="a">A</option>
<option value="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 })
}