¿Hay alguna manera de tener un componente secundario que represente solo una etiqueta <option> para activar onChange de su <select> principal?
Pregunto porque probé onClick y onChange en el niño <option> y parece estar distante de ellos.
La idea es un componente principal de React que se ve así:
render() { return ( <select value={this.state.value} onChange={this.handleChange}> <ChildOption onClick={this.handleChange} </select> ); }y el componente ChildOption así:
render() { return ( <option onClick={this.handleClick} /> ); } El código completo para este problema está aquí en un CodePen (suponga que está devolviendo una matriz de <option> s:
Código del mundo real aquí en Cloud9:
Puede tener un componente secundario que solo represente la etiqueta de option . En realidad, no necesita agregar un controlador de eventos a la etiqueta de option . El evento select onChange se llama automáticamente una vez que se hace clic en una etiqueta de option (pasando su valor con ella).
Vea el ejemplo aquí: http://codepen.io/anon/pen/oBzzWr?editors=0010