¿Hay alguna manera de acceder al elemento HTML que representa el complemento JS en React JS Ecosystem? No puedo usar ref en esos elementos.
por ejemplo: - si uso el complemento React Slick, agrega muchos elementos HTML a los que React JS no puede acceder. Necesito activar un evento de desplazamiento del mouse sobre esos elementos.
¿Alguien tiene una solución para este tipo de situación?
Gracias.
3 respuestas
Suponga que el id
del contenedor div que envuelve el componente <Slider/>
se llama container
, entonces el siguiente código debería funcionar al adjuntar el evento mouseover
a todos los nodos (divs en el control deslizante):
componentDidMount(){
let nodes = document.getElementsById("container").childNodes[0].childNodes
nodes.forEach(node => {
node.addEventListener('mouseover', () => {
//action to be performed here
}
})
}
Los complementos tienen su propia clase e identificación. Siempre puede inspeccionar y personalizar la clase que están utilizando. Pero esto puede causar cambios globales. Lo que puede hacer es utilizar clases y selectores personalizados para componentes separados. Entonces puede hacer cualquier cambio en el CSS.
Tal vez ayude
componentdidmount{
const elemnts = [...document.getElemetntByClassName('ClassName')]
elements.forEach(e => e.addEventListener('mouseover', () => {
// your code here
}))
}
Preguntas relacionadas
Nuevas preguntas
javascript
Para preguntas sobre la programación en ECMAScript (JavaScript / JS) y sus diversos dialectos / implementaciones (excepto ActionScript). Incluya todas las etiquetas relevantes en su pregunta; por ejemplo, [node.js], [jquery], [json], etc.