Soy un novato en ReactJS. Estoy tratando de hacer una barra de búsqueda de la siguiente manera:
class SearchBar extends Component { constructor(props) { super(props); this.state = {term: ''}; } render() { return ( <div> <input onChange={ event => this.setState({ term: event.target.value })} /> </div> ); } }Funciona, pero el problema es que no pude obtener el valor modificado de la entrada. ¿Qué tiene de malo? No pude encontrar una solución. Gracias por tu ayuda.
No está configurando el valor de la entrada. Debe cambiar su entrada al componente controlado que tiene su valor establecido por estado, por lo que su valor solo cambia cuando cambia el estado.
<input value = { this.state.term } onChange= { (event) => this.setState({ term: event.target.value }) } />Por lo tanto, this.state hace que el componente se represente y cuando se vuelve a representar, el valor del elemento (ejemplo de entrada) se establece en el nuevo valor de this.state.term.
No está asignando un valor a la entrada.
<input value={this.state.term} onChange={ event => this.setState({ term: event.target.value })} />