Cómo obtener la propiedad modificada desde StyleManager
@AbdiasM creo que esto es algo relacionado con la base y, que yo sepa, actualmente no es posible. Así es como debería ser: ¡Salud!
Lee la respuesta completa abajo ↓Pregunta
Hola,
¿Hay alguna forma de saber qué propiedad se modificó en el StyleManager? Por ejemplo, Si selecciono un componente de texto y cambio su propiedad de color de fondo desde el StyleManager, ¿hay algún evento donde pueda obtener la propiedad que se ha cambiado? He probado el evento 'component:styleUpdate', pero pasa el modelo del componente como argumento, no como propiedad.
Cualquier ayuda es bienvenida.
Respuestas (3)
@AbdiasM creo que esto es algo relacionado con la base y, que yo sepa, actualmente no es posible. Así es como debería ser:
editor.on('component:styleUpdate', component => {
console.log(Object.keys(component.changedAttributes()))
})
¡Salud!
De hecho, obtienes la propiedad modificada como segundo argumento de la llamada de regreso '''js editor.on('component:styleUpdate', (component, propChanged) => { ... })
Hola @AbdiasM basándote en component:styleUpdate o component:styleUpdate:{propertyName} puedes obtener la propiedad como la siguiente:
editor.on('component:styleUpdate:background-image', component => {
const sm = editor. StyleManager
const model = sm.getModelToStyle(component)
el modelo puede ser un Componente o una CssRule
const bg = model.getStyle()['imagen-fondo']
//...
¡Salud!
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #501
Añadir regla CSS personalizada
¡Hola! Me gustaría añadir una regla CSS que, por ejemplo, cambie la apariencia de un componente en función de algún atributo. Es decir, '''...
Issue #1344
StyleManager - ajustes globales de unidades - em, rem, mm
¡Hola! ¿Hay alguna forma de configurar una opción global para extender el array de unidades en StyleManager? Me gustaría dar, por ejemplo,...
Issue #2990
PREGUNTA: ¿Hay alguna forma de usar diferentes variantes del mismo estilo de propiedad?
Nota: Esto es en el contexto del Style Manager. ¿Hay alguna forma de usar diferentes variantes de la misma propiedad de estilo? Por ejemplo...
Issue #2404
Pregunta: cómo observar los cambios en los componentes de los niños
¿Hay alguna forma sencilla de suscribirme o escuchar los cambios en los componentes/hijos de mi tipo de componente personalizado? ¿Quizá al...
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 →Tutoriales relacionados
Guías detalladas sobre el mismo tema.
Tutorial
Ship to Production Faster: What’s New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
Tutorial
Preset DevFuture 2.0 — New Update Released
Preset continues evolving as a clean, production-ready starting point for building visual editors powered by GrapesJS
Tutorial
How Much Can You Earn on GJS.Market in a Month?
Discover how DevFuture earns €2,000+ monthly on GJS.Market — and learn how you can start building and selling your own GrapesJS plugins.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.