Obtener cambio en el depósito de la propiedad
Puedes usar el "modelo" pasado como parámetro para obtener la propiedad actual. Después de inspeccionar el objeto modelo, descubrí que podemos obtener el estilo usando model.attributes.style Deberías obtener el resultado deseado modificando tu fragmento de código de la siguiente manera: ' editor.on('component:styleUpd...
Lee la respuesta completa abajo ↓Pregunta
Estoy intentando escuchar el cambio en la propiedad 'float', ya sea que se haya desplazado a la 'izquierda', 'derecha' o 'ninguno' en el Style Manager usando un evento, pero mi código no parece dar el resultado deseado.
editor.on('component:styleUpdate:float', (model) =>
{ console.log('actualización de estilo', editor. StyleManager.getProperty('General','float')); });
Da 'style update null' como salida. La salida deseable sería float:right, float:left o float:none
Respuestas (3)
Puedes usar el "modelo" pasado como parámetro para obtener la propiedad actual. Después de inspeccionar el objeto modelo, descubrí que podemos obtener el estilo usando model.attributes.style
Deberías obtener el resultado deseado modificando tu fragmento de código de la siguiente manera:
' editor.on('component:styleUpdate:float', (model) => {
console.log('actualización de estilo', model.attributes.style);
}); `
@sakshigarg9 El enfoque que mencioné antes no funciona para algunos de los componentes, para ser más preciso, lo que observé es que la propiedad de estilo da cadena vacía en los componentes que tienen una clase definida.
Tu enfoque de usar el editor es correcto y también funciona para todos los componentes, lo único es que estabas usando un ID de sector incorrecto "General" en lugar de "general". Además, necesitas extraer el valor de float de la siguiente manera: editor. StyleManager.getProperty('general','float').attributes.value
El fragmento de código de abajo funciona para todos los componentes en la página web grapesjs-preset, tal como los he probado. Creo que también debería funcionar en tu implementación:
editor.on('component:styleUpdate:float', (model) =>
{
console.log('actualización de estilo', editor. StyleManager.getProperty('general','float').attributes.value);
});
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1971
Evento activa atributos de estado previos en almacenamiento remoto
Estoy intentando extraer el cambio en el 'src' de una imagen y almacenarlo en el almacenamiento remoto usando Storage Manager, usando el si...
Issue #1863
Incorporación de nuevos componentes a Block Manager
Estoy intentando añadir varios componentes que están en mi canvas al gestor de bloques, pero creo que por un problema de identificación no...
Issue #1511
[PREGUNTA] Cambiar el contenido html del componente seleccionado
Estoy intentando reemplazar el html del componente básico de texto usando el código que aparece a continuación ' const component = editor.g...
Issue #1534
Actualizar valor de entrada de propiedad desde el estilo del modelo.
@artf quiero actualizar la altura del elemento y quiero dar una altura personalizada usando el siguiente código ! altura Funciona bien y ac...
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.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.