Problema con el redimensionador personalizado (o quizá cómo guardo/cargo componentes)

Question

Estoy intentando construir un redimensionador personalizado para uno de mis componentes. Es una disposición cuadrícula/columna basada en Flexbox y quiero que los usuarios puedan redimensionar una columna (a un ancho fijo) y que las otras columnas ocupen el espacio restante. Ya tengo un componente personalizado para mi columna, así que le he añadido configuración de resizeador, incluyendo una función updateTarget(), y funciona muy bien. Sin embargo, si guardo ese contenido y luego vuelvo a él, l...

artf · Accepted Answer

Sí, tienes razón. Esto ocurre simplemente porque las funciones no son serializables, por lo tanto, cuando grapesjs llama a 'JSON.stringify(Component)' simplemente se copia. La solución para tu caso es sobrescribir el método 'toJSON' en el componente personalizado '''js editor. DomComponents.addType('grid-col', { modelo: .. valores por defecto: ... // aquí defines tu redimensionable ... y luego evitar su almacenamiento toJSON() { const obj = defaultModel.prototype.toJSON.apply(this, arguments);...

thecodefish · Answer

Gracias@artf eso funcionó.

sakshigarg9 · Answer

@thecodefish ¿Cómo cambias el estado inicial de las propiedades del Redimensionador? ¿A dónde va esta configuración si uso la página web de grapesjs-preset, simplemente bajo grapesjs.init{...}? Quiero fijar una dimensión mínima específicamente para un componente de imagen y desactivar algunos puntos de esquina como tl, tc, tr.

Problema con el redimensionador personalizado (o quizá cómo guardo/cargo componentes)

Pregunta

Respuestas (3)

Preguntas y respuestas relacionadas

Cuando la vista del componente modifica el HTML, los componentes de texto ya no son editables

No se puede arrastrar un elemento de la lista dentro de la lista no ordenada

¿El nuevo tipo de rasgo no funciona con los componentes renderizados?

Añadir html personalizado dentro de Canvas

Plugins de pago que cumplen con este problema

Tutoriales relacionados

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

Explorar categorías de plugins