La entrada de color no actualiza el elemento en la página
@art creo que el problema aquí es que dentro de la función setValue(val, opts = {}) de InputColor.js no llama al evento de cambio dentro del espectro. Parece que hay que separarlo.
Lee la respuesta completa abajo ↓Pregunta
Cuando uso el selector de color, todo funciona bien.
Sin embargo, si añades un valor hex a la entrada y pulsas Enter, la vista previa de color se actualiza pero el color no se aplica al elemento de la página
Respuestas (3)
@art creo que el problema aquí es que
colorEl.spectrum('set', valueClr);
dentro de la función setValue(val, opts = {}) de InputColor.js no llama al evento de cambio dentro del espectro. Parece que hay que separarlo.
@artf he estado mirando esto bastante y he conseguido que funcione, pero la forma en que lo he hecho me parece un poco improvisada.
El problema que encontré fue dentro de src\domain_abstract\ui\InputColor.js dentro de setValue(val, opts = {}).
el valor opts.targetUpdate no está definido tras el segundo bucle.
Añadí estos, justo encima de la sentencia IF, y cambié la variable previousСolor para que todas las funciones puedan acceder a ella.
model.set('value', valueClr);
colorEl.spectrum('set', valueClr);
if (opts.targetUpdate) {
self.previousСolor = valueClr;
this.noneColor = valueClr;
}
De nuevo, esto me parece un poco forzado, no estoy seguro de si es el enfoque correcto.
@sonnylloyd en realidad el verdadero problema está aquí https://github.com/artf/grapesjs/blob/dev/src/domain_abstract/ui/Input.js#L24-L27
Debería ser: '''js handleChange(e) { e.stopPropagation(); this.model.set('value', this.getInputEl().value); this.elementUpdated(); },
Ya he hecho este cambio en el último RC, puedes verlo funcionar aquí
http://grapesjs.com/demo-no-jq.html
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1092
[BUG] rasgos y disparador de almacenamiento
Oye, quizá no sea un bicho, no estoy seguro. Tengo rasgos con changeProp: campo verdadero. Cuando cambio el valor del rasgo por interfaz, e...
Issue #727
Dos dispositivos con el mismo ancho
Hola a todos, Tenemos un escenario en el que necesitamos tener dos dispositivos con el mismo ancho. Casi todo funciona bien, pero cuando in...
Issue #1506
Problema con la consulta de medios en CSS
Hola @artf Hay un problema en la página de demostración y en la biblioteca en media query. El problema es que si el usuario actualiza el es...
Issue #806
[Bug]: las flechas del bloque extra de transformación no funcionan
¡Hola! Como digo en el título, las flechas para aumentar o disminuir la rotación de cualquier elemento en el lienzo no funcionan. Tampoco f...
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
Ship to Production Faster: What’s New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
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
GrapesJS Inline RTE Plugins Update: CKEditor 5 v0.1.4 and Froala Inline Text Editor
CKEditor 5 Inline for GrapesJS v0.1.4 fixes Studio SDK toolbar clipping, iframe injection and link balloon bugs. Compare with Froala Inline — both $69.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.