El administrador de deshacer no funciona correctamente para deshacer una acción de eliminación
Sí, deshacer activa el 'change:columns', en tu caso podrías intentar envolver tus cambios en 'updateColumns' en el 'editor'. Deshacer. Gestionador.saltar. '''js updateColumns() { editor. UndoManager.skip(() => { Tus operaciones }) } ```
Lee la respuesta completa abajo ↓Pregunta
Versión GrapesJS
- Confirmo que se debe usar la última versión de GrapesJS
¿Qué navegador usas?
Chrome - versión 110.0.5481.100 (Versión oficial) (arm64)
Enlace de demo reproducible
https://codepen.io/faisal-praella/pen/ExeNwxJ
Describe el bicho
- He añadido un componente personalizado columns con un nombre de rasgo numérico columns usado para añadir o eliminar la columna del componente hijo.
- Cuando añado una columna nueva usando el rasgo y deshago el cambio, funciona bien, pero cuando elimino la columna y deshago el cambio, se añade una columna extra.
- Esto puede deberse a que cuando Grapesjs deshace eliminar cambio, añade la columna eliminada y también revierte el rasgo de columna, pero este cambio de rasgo de columna activa 'this.listenTo(this, "change:columns", this.updateColumns);' que también añade la nueva columna. Si este es el caso, ¿cómo evitar escuchar el cambio de rasgo de columna al deshacer o al deshacer el cambio eliminado? Grapesjs debería añadir primero el elemento eliminado y luego revertir todos los demás cambios de propiedad/rasgo (deshacer en orden inverso) o cualquier otra forma de manejar esta situación?
¿Cuál es el comportamiento esperado? No se debe añadir ninguna columna extra al deshacer la acción de eliminar.
¿Cuál es el comportamiento actual? Se añade una columna extra al deshacer la acción de eliminar.
Código de conducta
- Acepto seguir el Código de Conducta de este proyecto
Respuestas (4)
Sí, deshacer activa el 'change:columns', en tu caso podrías intentar envolver tus cambios en 'updateColumns' en el 'editor'. Deshacer. Gestionador.saltar. '''js updateColumns() { editor. UndoManager.skip(() => { Tus operaciones }) }
Vale, entonces cierro este y por favor abre un nuevo problema de error relacionado con rasgos de casilla.
Gracias, @artf funciona, para arreglarlo estaba desactivando el oyente de cambio de rasgos escuchando los eventos de deshacer el comando antes y ejecutar, pero esto se siente más limpio. El rasgo de casilla no se marca ni desmarca al deshacer o rehacer (el valor del rasgo se actualiza por mi parte). Reproducible en la página web de Grapesjs demo. También necesito ayuda aquí, gracias de nuevo.
Gracias por informar de esto, @FaisalShaikhHA.
Buena pregunta sobre El gestor de deshacer no funciona correctamente para deshacer una acción de eliminación. El enfoque recomendado con UndoManager es usar la API orientada a eventos.
Empieza aquí:
- Consulta la documentación de GrapesJS de tu módulo específico
- Busca el método del oyente de eventos 'on()'
- La mayoría de las operaciones se pueden realizar escuchando eventos del editor y de los componentes
Patrones comunes: '''javascript Prestad atención a los cambios editor.on('Change', () => console.log('Something Changed'));
Ciclo de vida de los componentes editor.on('component:mount', (c) => console.log('component ready', c)); editor.on('component:update', (c) => console.log('component updated', c));
**Si sigues atascado:**
- Compartir una reproducción mínima de CodeSandbox
- Incluye lo que ya has probado
- Menciona tu versión GrapesJS
- ¡La comunidad está aquí para ayudar!
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #5632
Añadir un cambio al desadministrador
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome v91 Enlace de demo reproducible ht...
Issue #4812
La propiedad en capas no funciona como se espera en el escenario padre-hijo.
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? 107.0.5304.110 (Versión oficial) (arm64)...
Issue #5631
Deshacer el add() del gestor no funciona como se esperaba
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome v91 Enlace de demo reproducible --...
Issue #5530
Deshacer el inicio y parar del jefe no funciona como se espera
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome v91 Enlace de demo reproducible ht...
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
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
Tutorial
Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS
In May we shipped major updates to two of our most popular GrapesJS plugins — TinyMCE Inline Text Editor and Placeholder.
Tutorial
Find the Right GrapesJS Plugin in Seconds: Smarter Discovery Is Live
We're shipping a set of discovery upgrades. New label filters, a proper compatibility switch for GrapesJS vs Studio, one-click and a smarter sort bar.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.