Estaba leyendo los documentos Refs and the DOM y A complete guide to React refs para comprender mejor el concepto de refs en React. Sin embargo, no estoy seguro de por qué se necesita el concepto cuando se puede resolver de la manera Vanilla JS.

Por ejemplo, en el segundo enlace mencionado anteriormente, el autor del artículo dice que React no proporciona una manera fácil de enfocar automáticamente un elemento de texto y que, en tal escenario, las referencias serían útiles. Para verificar eso, estaba experimentando con métodos alternativos para lograr el mismo enfoque automático sin referencias. Aquí hay una parte de mi solución:

 class ExampleComponent extends Component { . . . componentDidMount () { // accessing an element without using refs const element = document.getElementById(this.inputId); if (element) { element.focus(); } } . . . render () { return ( <input id={this.inputId} onChange={this.handleChange} value={this.state.value} /> ); } }

Y funciona.

¿Cómo son las referencias mejores que la solución anterior? Me parece bastante simple, pero podría estar perdiéndome algo.

Gracias por adelantado.