Modo de vista previa y desactivación automática de bordes de componentes
botón ya estaría desactivado para cuando se ejecutara la partida de Preview, ¿es correcto? Ah, sí, claro 🤦 ♂ Por tu respuesta sobre el problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los contextos de los dos botones como sugeriste. Vale, puede que...
Lee la respuesta completa abajo ↓Pregunta
Hola de nuevo, :)
Nuestro equipo empezó recientemente a personalizar el editor y a eliminar el preajuste de la página web, y puede que hayamos encontrado algunos errores relacionados con el modo de vista previa:
- Al salir del modo de previsualización, puede aparecer un error si se ha eliminado el panel predeterminado de 'opciones', o si se ha eliminado el botón 'sw-visibility' (de aquí, si 'editor. Panels.getButton('options', 'sw-visibility')' da 'null', cf. #2589)
Una solución propuesta sería recorrer en bucle la colección de paneles (consultada a través de 'editor. Panels.getPanels') para encontrar el botón 'sw-visibility', así como añadir comprobaciones nulas para evitar errores.
- Cuando los botones 'previsualización' y 'visibilidad sw' están en el mismo panel, el comportamiento introducido por el #2589 se rompe, esto parece provenir del 'ButtonView''s active change listener, que desactiva todos los botones activos en el panel. Así que si la vista previa está activada, desactiva el botón de 'visibilidad sw' antes de ejecutar el comando, lo que luego rompe su comprobación activa.
Me temo que no puedo proponer una solución respecto a este punto 2. Debido a mi falta de conocimiento sobre los posibles efectos secundarios al modificar los botones Active Change Listener. Pero podría incluir tus sugerencias en un departamento de relaciones públicas si hace falta.
Estaría encantado de abrir un PR, o como esto está bastante relacionado con el #2636, arreglar ambos problemas en uno.
¡Saludos :)
Respuestas (3)
botón ya estaría desactivado para cuando se ejecutara la partida de Preview, ¿es correcto?
Ah, sí, claro 🤦 ♂
Por tu respuesta sobre el problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los contextos de los dos botones como sugeriste.
Vale, puede que funcione de verdad... al estar en un contexto diferente, no se detendrá con otros botones, y también puedes dejar de depender de los botones por completo (como has dicho, puedo colocarlo en otro panel) y comprobar el estado del comando usando Commands.getActive API '''js si ('SW-visibility' en el editor. Commands.getActive()) { La visibilidad de SW está activa }
Gracias @mcottret por todas las referencias, el número está realmente bien escrito :)
Cuando los botones de vista previa y de visibilidad de pantalla están en el mismo panel, el comportamiento introducido por el #2589 se rompe, esto parece provenir del escuchador activo de cambio de ButtonView, que desactiva todos los botones activos del panel. Así que si la vista previa está activada, se desactiva el botón de visibilidad de la pantalla de seguridad antes de ejecutar el comando, lo que luego rompe su comprobación activa.
Creo que, en este caso, deberíamos crear una bandera de variable comprobando si la visibilidad de la variable está activa antes de hacer esto: https://github.com/artf/grapesjs/blob/85b7b82103e12fb01a3700b1002a57a7b60ccaf1/src/commands/view/Preview.js#L20 Luego, en 'parar', comprobamos la variable almacenada al iniciar (en lugar del botón)
¡Gracias por la respuesta @artf
Lo siento, pero no estoy seguro de cómo hacer que esto funcione; por lo que tengo entendido, el active change listener se ejecuta antes de la 'ejecución' de 'Preview', así que el botón de 'sw-visibility' ya estaría desactivado para cuando se ejecutara 'Preview', pase lo que pase, ¿es correcto?
Por tu respuesta al problema enlazado, entiendo que este comportamiento es intencionado, así que quizá la solución sea simplemente separar los dos contextos de los botones como sugeriste.
¿Qué opinas del punto 1? ¿Y mi solución propuesta? Ya he añadido la protección por si el botón de 'visibilidad sw' se hubiera eliminado en este PR, pero no gestiona casos en los que el botón de 'sw-visibility' esté presente en otro panel personalizado (con un id distinto a 'opciones').
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #2636
[Bug]: Paneles personalizados no ocultos en modo de vista previa
Hola de nuevo, :) Nuestro equipo empezó recientemente a personalizar el editor y a eliminar el preajuste de la página web, y puede que haya...
Issue #2117
[Pregunta] Atributos que no cargan en el editor
Hola @artf, He creado algunos componentes personalizados con rasgos. Guardo el archivo y recargo sin poder ver los atributos en el editor n...
Issue #1855
Copiar y pegar componentes
Hola equipo de Grapesjs He visto que el copiar y pegar normal funciona siempre que esté hecho en la misma página. ¿Es posible implementar u...
Issue #2463
No puedo implementarlo con iframe. "CONTENEDOR" dentro del marco y "BLOQUE" fuera del marco
Hola equipo, Soy nuevo en Grapejs y un poco más fresco en JS. Lo que tengo que lograr => Tengo que hacer que el contenedor se muestre en if...
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.