¿Obtener CSS de un componente seleccionado?
Podrías escuchar el evento 'component:selected', y luego obtener el elemento DOM del componente a partir de ahí. Después, podrías simplemente usar javascript para obtener el estilo de ese componente. Sobre cómo obtener estilo con javascript, puedes consultar este enlace Cómo obtener valores CSS en JavaScript Aquí tien...
Lee la respuesta completa abajo ↓Pregunta
Hola, ¿cómo puedo obtener el CSS de un componente seleccionado?
Respuestas (3)
Podrías escuchar el evento 'component:selected', y luego obtener el elemento DOM del componente a partir de ahí. Después, podrías simplemente usar javascript para obtener el estilo de ese componente. Sobre cómo obtener estilo con javascript, puedes consultar este enlace Cómo obtener valores CSS en JavaScript
Aquí tienes un ejemplo:
editor.on('component:selected', (component) => {
const domElement = component.getEl();
const style = window.getComputedStyle(domElement)
})
También puedes obtener el componente seleccionado actualmente haciendo 'editor.getSelected()'
¿Cómo obtener/establecer/establecer Style() del estado de hover desde un componente? ¿Esto es posible?
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #2861
[AYUDA] Obtén CSS de un componente seleccionado y sus hijos
Hola, Estoy intentando implementar la posibilidad de guardar elementos como bloques personalizados. ¿Cómo puedo obtener CSS de un component...
Issue #2922
[PREGUNTA]: Consigue todo CSS sin componentes específicos y sus hijos
Hola, en este número #2861 podemos obtener todo el CSS de un elemento seleccionado y sus hijos con: Pero si quiero conseguir todo el CSS pe...
Issue #1842
Mostrando dos veces algunas propiedades y tampoco mostrando algunas opciones.
Hola, @artf @NicoEngler, Tengo un problema extraño. Estoy usando grapes.js y grapes.min.css con la versión 0.14.50. Mientras selecciono cua...
Issue #1388
Actualizar el estilo del componente seleccionado
Estoy intentando actualizar el CSS del elemento seleccionado. Ejemplo: Elemento seleccionado: '<div id="inul" class='class1'>Hola</div>' el...
Plugins de pago que cumplen con este problema
Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.
Cargando recomendaciones de plugins de pago...
Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.
Explora plugins gratuitos →Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.
Explora plugins premium →Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.