Saltar al contenido

¿Cómo uso Reaccionar useRef gancho con examplesAug, 12thIn este tutorial, vamos a aprender acerca de cómo acceder a la dom …

marzo 13, 2020

 

En este tutorial, vamos a aprender acerca de cómo acceder a los nodos DOM en reaccionar usando useRef gancho.

Reaccionar ganchos son funciones de JavaScript que nos ayuda a utilizar la falta reaccionar cuenta con componentes infunctional.

useRef gancho

En reaccionar useRef gancho nos ayuda a acceder a los nodos DOM HTML o elementos, de manera que podamos interactuar con ese elemento DOM como acceder al valor de elemento de entrada o de enfocar el elemento de entrada.

ejemplo :

import React,{useRef} from 'react';

function TextInput(){
//creating the ref by passing initial value null
const nameRef = useRef(null);
function handleFocus(){
//current property is pointing to the input element
//when a component is mounts to dom
nameRef.current.focus() }
return(

)

}

En el ejemplo anterior, hemos importado useRef gancho de la ‘reaccionar’ entonces invocado el gancho useRef haciendo pasar la nulo valor inicial. elemento de entrada

En definimos ref atributo pasando el nameRef para que podamos acceder a ese elemento de entrada mediante el uso de la propiedad nameRef.current.