Buenas grupos tengo un problema de visualización con un carousel de materialize que implemento en react, estoy implementando un carousel con la plantilla de materialize el cual se muestra sin ningun problema en un componente de react, el problema surge que cuando utilizo react roter dom al cambiar de paginas con Link y regresar al componente que tiene el carousel este ya deja de funcionar y solo se pone en una imagen ploma sin ninguna funcion, es algun problema interno o como puedo solucionar ya que son muy interesantes las plantillas de materilize
1 respuesta
Realmente cuando estas trabajando con componentes externos, deberas saber que react ocupa ciclos de vida, te dejo un ejemplo.
Class Component
componentDidMount() {
const elems = document.querySelectorAll('.carousel');
const instances = M.Carousel.init(elems, options);
}
Hooks
useEffect(() => {
const elems = document.querySelectorAll('.carousel');
const instances = M.Carousel.init(elems, options);
})
En conclusion.. deberas de instanciar el
Carousel
de Materialize siempre que se monte el componente..
-
1Muchas gracias el problema se soluciono anteriormente manejaba todo en el index.html del public pero al instanciar nuevamente cada que se routea al carousel se carga nuevamente este sin problemas. Commented el 1 abr. 2020 a las 1:12