Tengo mi componente de lista de selección representando mi lista de selección:
<form className="pure-form"> <select ref="selectMark" className="mark-selector" onChange={this.onChange}>{this.getOptions()} </select> </form>Tengo un método en el componente para crear las opciones:
getOptions: function () { return this.props.renderProps.data.map(function (item) { return <option key={item.value} value={item.value}>{item.label}</option>; }.bind(this)); },Mi método onChange funciona bien con el valor:
onChange: function(event) { var newValue = event.nativeEvent.target.value; this.props.renderProps.onSaveCare(newValue); this.setState({value: newValue}); this.toggleEdit(); },¿Hay alguna manera de obtener el texto de la opción? Esto me da indefinido
event.nativeEvent.target.text; //undefinedAlgo como esto debería hacer
var index = event.nativeEvent.target.selectedIndex; event.nativeEvent.target[index].textAquí hay una demostración http://jsbin.com/vumune/4/
Puede obtener el texto de la opción reemplazando esto:
event.nativeEvent.target.text;con este:
event.target.options[event.target.selectedIndex].textSi es una selección única, aquí hay una forma más simple:
e.target.selectedOptions[0].text