El script de actualización no actualiza correctamente el script de componentes después de cargar automáticamente un componente desde html en localStorage
'gjs-html' contiene el HTML final, el HTML que tus usuarios verán, así que es correcto que veas el script "compilado". Para una edición correcta, tienes que confiar en 'gjs-components', que básicamente es una representación en JSON de la plantilla y contiene toda la información sobre tus componentes
Lee la respuesta completa abajo ↓Pregunta
Estoy usando GrapesJS v0.14.5 en una copia local. SO: Ubuntu 16.04 LTS Navegador: Chrome Versión 64.0.3282.140 (Versión oficial) (64 bits) Creo que no puedo reproducirlo de la demo
Tengo un componente con el guion actual: '''javascript script: función () { console.log('¡Secuencia de script!', '{[ marca de tiempo ]}'); var timestamp = '{[ timestamp ]}'; var comp = xGrapes.comp;
var vm = new Vue({ el: '#app-contenedor-${timestamp}', componentes: { Comp: Comp }, data: función () { return { msg: "{[ mensaje ]}" } }, plantilla: '<div><h1>{{msg}}¡</h1><p>Genial!</p><comp message="{[ anotherMessage ]}"></comp></div>' }); }
(La parte de la variable "comp" es de una funcionalidad de [plugin](https://github.com/alvimm/grapesjs-expose) que estoy desarrollando actualmente, pero creo que puedes ignorarla)
Como puedes ver, estoy renderizando un componente de Vue. Este componente tiene algunos datos vinculados mediante rasgos. Cuando añado el componente en canvas y cambio sus rasgos, el script se actualiza inmediatamente y vuelvo a cargar el componente con el nuevo mensaje, ya que uso el método 'updateScript', como puedes ver aquí:
init() {
this.insertAppContainer()
this.listenTo(this.model, 'change:message change:anotherMessage', this.onChangeProps); editor.on('load', this.onChangeProps.bind(this)); },
onChangeProps() { this.insertAppContainer(); this.updateScript(); }
Hasta ahora todo ha funcionado como se esperaba. :+1:
Si actualizo la página, mi lienzo se vuelve a cargar con contenido HTML almacenado en el elemento localStorage 'gjs-html', ya que tengo 'storageManager.autoload = true'.
Ahora, si actualizo las propiedades de mis rasgos con un nuevo valor, los mensajes no se actualizan en absoluto (siguen mostrando el último valor guardado antes de la actualización) y he notado por qué:
Antes de la actualización de la página, si 'console.log' mi 'model.attributes.script', este es el resultado:
! [captura de pantalla del 23-02-2018 del 22-15-2018](https://user-images.githubusercontent.com/11471014/36610309-9e01b400-18ae-11e8-9d15-87d2a3dec2e1.png)
Tras la actualización de la página, este es el resultado:
! [captura de pantalla del 23-02-25-2018](https://user-images.githubusercontent.com/11471014/36610365-c9fd6234-18ae-11e8-9400-57ebf16b3e71.png)
La función script se almacena en 'gjs-html' como una cadena con las variables codificadas en fija. Después de la recarga no tiene la notación como '{[ mensaje ]}', sino el último valor guardado.
Espero haber sido claro.
¡Gracias! :sonríe:
Respuestas (2)
'gjs-html' contiene el HTML final, el HTML que tus usuarios verán, así que es correcto que veas el script "compilado". Para una edición correcta, tienes que confiar en 'gjs-components', que básicamente es una representación en JSON de la plantilla y contiene toda la información sobre tus componentes
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 #1298
[Bug] El editor interno no elimina un componente al seleccionarse desde el Administrador de Capas
Estoy usando la última versión de Grapejs y actualmente puedo recrear este número en la demo. El problema que tengo es cuando selecciono al...
Issue #871
[BUG] Opciones incorrectas de stylemanager la primera vez que se selecciona un componente/bloque
Hola, He notado el siguiente comportamiento con errores en el gestor de estilos:Usando una copia local de GrapesJS (ver 0.14.5). Probado en...
Issue #1693
[BUG|/PREGUNTA] Caracteres extraños (Â) dentro de la vista previa CSS/HTML; Los elementos no se eliminan completamente
BICHO¿Estás usando la última versión (las versiones anteriores NO son compatibles)?0.14.50¿Te enfrentas al error con tu copia local de Grap...
Issue #1411
Se requiere el activado manual del renderizado del gestor de activos tras abrir la ventana emergente AM
Preguntas P: ¿Estás usando la última versión (las versiones anteriores NO son compatibles)? R: Sí Q. ¿Te enfrentas al error con tu copia lo...
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.