Cambiar el layerable en un evento en tiempo de ejecución no se actualiza inmediatamente
Lo mismo ocurre cuando intento añadir o eliminar un botón de barra de herramientas en un evento: la barra de herramientas no se actualiza hasta que desselecciono el componente y lo vuelvo a seleccionar:
Lee la respuesta completa abajo ↓Pregunta
Cuando cambio la opción de capas de un componente personalizado en un evento, sigue apareciendo en las capas hasta que lo arrastras una vez. ¿Hay alguna forma de evitar esto forzando la actualización de las capas? ¿O podemos conseguir una solución de error para esto? Gracias.
importar uvas de 'uvas';
importar 'grapesjs-blocks-basic';
const editor = grapesjs.init({
Contenedor: '#gjs',
fromElement: 1,
storageManager: { type: 0 },
Plugins: ['GJS-Bloques-Básico']
});
VAR Comps = Editor. DomComponents;
var defaultType = comps.getType('default');
var defaultModel = defaultType.model;
comps.addType('test', {
model: defaultModel.extend({
init: function() {
this.on("change:attributes:id", () => {
lets atributos = this.getAttributes();
this.set({'layerable': attributes.id === 'layerable'});
});
}
})
});
editor. BlockManager.add('test', {
etiqueta: 'prueba',
Categoría: 'algo',
contenido: '<div data-gjs-type="test" style="height: 20px; background-color: blue;" id="layerable"></div>'
});
Vídeo: Grapesjs layerable.zip
Respuestas (3)
Lo mismo ocurre cuando intento añadir o eliminar un botón de barra de herramientas en un evento: la barra de herramientas no se actualiza hasta que desselecciono el componente y lo vuelvo a seleccionar:
this.on("change:attributes:id", () => {
Sea tb = model.get('toolbar');
if (attributes.id === 'capaz') {
si (tb.filter(b => b.attributes.class === 'fa fa-plus').length > 0)
TB.pop();
}
else {
si (tb.filter(b => b.attributes.class === 'fa fa-plus').length === 0)
tb.push({
Atributos: { Clase: 'FA FA-plus' },
comando: () => {
model.components().add('<div>test</div');
}
});
}
});
Además, si pones 'removible' en falso en el mismo lugar donde se pone 'layerable' en mi publicación, la barra de herramientas no se actualiza para eliminar el botón de borrar hasta que guardas y vuelves a cargar.
Intenta activar este evento después de que tus actualizaciones 'editor.trigger('component:toggled')'
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #577
Solo permite un componente de tipo específico en el editor
¿Hay alguna forma de no permitir que ningún componente específico se deshaga más de una vez en la página? Tengo un componente personalizado...
Issue #3134
Desplázate en el lienzo hasta la parte superior de la página cuando intento arrastrar un elemento de las últimas secciones
Versión: 0.16.27 ¿Puedes reproducir el error de la demo? [X] Sí [ ] No ¿Cuál es el comportamiento esperado? Cuando intento arrastrar un com...
Issue #1114
[BUG] La salida HTML personalizada no se ejecuta al recargar
Estoy usando las propiedades toHtml e isComponent para un componente personalizado que permita una salida HTML personalizada. Esto parece f...
Issue #1374
Propiedades predeterminadas de los componentes
¿Hay alguna forma de cambiar las propiedades predeterminadas de los componentes? Quiero que casi todo sea 'copiable: false, redimensionable...
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.