1

introducir la descripción de la imagen aquí

Mi intencion es que al dar click en un elemento del header en este caso al de Votar quiero que se mueva (haga un foco) automaticamente al componente MenuVotacion. Probé haciendo foco a un input y funciona pero con un componente no lo hace.


    const votar = useRef(null);

    const focusVotar = () => {
        votar.current.focus();
    }

    return (
        <div className='ContenedorWeb'>
            <Header focusVotar={focusVotar}/>
            <MenuVotacion ref={votar}/>
            <ComoFunciona />
            <SobreNosotros />
            <Footer />
        </div>
    )
}
11
  • Supongo que quieres hacer focus en las opciones que contiene Heaer o a todo el componente ?
    – Richard
    Commented el 26 mar. 2021 a las 19:23
  • Quiero hacer foco al componente MenuVotacion, es decir un scroll automatico hasta esa seccion. Commented el 26 mar. 2021 a las 19:25
  • por favor agrega el código de Header.
    – Richard
    Commented el 26 mar. 2021 a las 19:30
  • 1
    Has probado con votar.current.scrollIntoView() en vez de votar.current.focus() ?
    – FranAcuna
    Commented el 26 mar. 2021 a las 19:55
  • 2
    Si has solucionado tu problema, por favor agrega la solución como respuesta, para que otros tengan referencia de solución a problemas similares.
    – Richard
    Commented el 26 mar. 2021 a las 20:32

2 respuestas 2

0

La solucion que es encontrado es crear un paraffo

vacio encima del componente y en vez de enfocar el componente, lo hago con el elemento p

0

En tu div tienes que colocar el atributo tabIndex="0"

<div tabIndex="0"></div>
1
  • 1
    Tu respuesta podría mejorarse con información de apoyo adicional. Por favor, pulsa en editar para añadir más detalles, como citas o documentación, para que otros puedan confirmar que tu respuesta es correcta. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda.
    – Comunidad Bot
    Commented el 20 ene. a las 3:21

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.