Problemas con GrapesJS

Problemas analizados por 3,464 en GitHub 370 resuelto · 90 abierto. Busca, filtra y explora respuestas probadas en batalla.

Se han detectado problemas con 877

🔍 question
#322611 de enero de 2021por chenjingling902 respuestas
Reacciones 0

HAZAÑA: cómo hacer 4 propiedades en una fila, como relleno, margen

¿Cómo podría controlar las propiedades para que se muestren en una o dos filas, como en las demos? ! imagen ! imagen Cuando descargo el boletín de proyecto grapesjs-preset-newsletter en local, también muestra el relleno y el margen en dos filas, lo cual es desconcertante. De hecho, me gustaría ponerlos flexibles con f...

artf

Simplemente usa el CSS

ClaudeCode

Gracias por informar de esto, @chenjingling90. Buena pregunta sobre FEAT: cómo hacer 4 propiedades en una fila, como relleno, margen. El enfoque recomendado con GrapesJS es usar la API orientada a eventos. Empieza aquí: Consulta la documen...

#32259 de enero de 2021por Abhisheknanda13444632 respuestas
Reacciones 0

¿Cómo actualizar el estilo a partir de un rasgo de casilla?

Hola @artf Estoy intentando actualizar el estilo usando el rasgo de casilla, pero no llama a la función. Aquí está el código ¡Agradezco mucho cualquier consejo que podáis darme! Gracias

Abhisheknanda1344463

@artf Lo entendí, tonto-Error Mueve la función de init dentro del propio modelo. Cerrando el asunto

ClaudeCode

Gracias por informar de esto, @Abhisheknanda1344463. Buena pregunta sobre ¿Cómo actualizar el estilo a partir de un rasgo de casilla?. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la do...

#32227 de enero de 2021por bgrand-ch3 respuestas
Reacciones 0

¿Cómo actualizar/volver a renderizar después de añadir un nuevo nodo?

Añado manualmente un nuevo nodo a un componente renderizado. El resultado visual está bien, pero es imposible de guardar, porque mi estilo no es con el ID GrapesJS generado automáticamente. Para resolver manualmente este poblem, hago doble clic en el componente para entrar y luego hago clic en el exterior en el cuerpo...

bgrand-ch

Archivo optimizado 'TextEditor.vue': '''js // ... onFontValidate () { const { rte } = this.getRteData() const spanNode = document.createElement('span') sea anchorNode = {} this.selection.childNodes.forEach(childNode => { console.log({ chil...

bgrand-ch

i️ No funciona directamente con HTML, solo funciona con JSON. Component = nodo JSON (elemento html + GrapesJS data) '''js addStylesToText (styles, tagName = 'span') { const inlineStyles = styles.map(style => style.join(':')).join(';') + ';...

ClaudeCode

Gracias por informar de esto, @bgrand-ch. Buena pregunta sobre ¿Cómo actualizar/volver a renderizar después de añadir un nuevo nodo?. El enfoque recomendado con ProseMirror es usar la API orientada a eventos. Empieza aquí: Consulta la docu...

#32217 de enero de 2021por lebonsavane2 respuestas
Reacciones 0

Botón para acceder a un área de texto

Hola a todos, Necesito poner un botón en un área de texto, ¿cómo puedo hacerlo? ¿Hay una propiedad que modificar o es algo distinto? ¿Y es realmente posible hacerlo? Gracias por tu respuesta @artf

artf

No, no puedes, el área de texto solo contiene texto

ClaudeCode

Gracias por informar de esto, @lebonsavane. Buena pregunta sobre Botón en un área de texto. El enfoque recomendado con GrapesJS es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de tu módulo específico...

#32185 de enero de 2021por bgrand-ch4 respuestas
Reacciones 2

¿Cómo añadir un nuevo elemento HTML con estilos en línea?

Me gustaría añadir un nuevo elemento HTML, con estilos en línea, alrededor del 'rte.selection()'. Con el siguiente ejemplo, el HTML está bien, pero probablemente no la parte JSON: '''js const editorRte = this.editor.RichTextEditor // ... editorRte.add('fontSize', { icono: ' <select> <valor de opción="" deshabilitado s...

artf

@bgrand-ch, ¿qué quieres decir con "probablemente"? 😅

bgrand-ch

@artf gracias por tu respuesta 🙂 rápida, actualizar las dependencias a '0.16.30' resuelve mi problema 🎉

bgrand-ch

https://github.com/artf/grapesjs/issues/3069 🤔

#32165 de enero de 2021por tomhatzer4 respuestas
Reacciones 2

HAZAÑA: Añadir referrerPolicy a la carga de imágenes a través del gestor de activos

¿Qué intentas añadir a GrapesJS? Estoy intentando añadir la cabecera 'Referer' a la carga de imágenes desde el administrador de recursos. Describe tu solicitud de función detallado Estoy trabajando en un pagebuilder alojado en AWS. Para evitar que la gente haga enlaces directos a mis imágenes, he implementado AWS WAF...

artf

Como ya se respondió al PR, esto se puede hacer ampliando el componente de imagen si es necesario, sin riesgo de romper la integración para otros. Y como apunte, cuando quieras añadir una función, siempre deberías pensar en cómo funcionará...

tomhatzer

Muchas gracias por el consejo @artf - intentaré hacerlo ampliando el componente original. ¡Que tengas un gran día! 😃

tomhatzer

Para todos los que tienen el mismo problema de que el iframe no envía cabeceras de referencia para el contenido mostrado dentro, aquí va una solución rápida y sencilla. Solo tienes que configurar el 'src' del iFrame de Canvas en el dominio...

#32154 de enero de 2021por san-1232 respuestas
Reacciones 0

Problemas de carga de contenido desde una base de datos remota

Hola, Creé Grapejs Pagebuilder. Tengo dos enlaces, uno para Pagebuilder1 y otro para PAgeBuilder2. Ambos se redirigen al editor grpaejs y carga de contenido desde la base de datos según el id. Cuando hago clic en PageBuilder1 va a index.html?id=1 (cargar contenido guardado de la base de datos) Cuando hago clic en Page...

artf

Sigue esta guía https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage

ClaudeCode

Gracias por informar de esto, @san-123. ¡Gran sugerencia sobre problemas de carga de contenido desde una base de datos remota! Aunque esta función específica aún no está en la API principal, existen varias formas de lograr un comportamient...

#321330 de diciembre de 2020por theSC0RP4 respuestas
Reacciones 5

Cómo guardar los rasgos añadidos dinámicamente

Hola @artf, tengo un componente personalizado que tiene un rasgo de botón. Cuando se pulsa el botón, añado dinámicamente un rasgo personalizado usando 'comp.addTrait()'. Cuando cargo la plantilla guardada, quiero que el contenedor muestre también los rasgos añadidos dinámicamente. (Estoy cargando la plantilla usando c...

artf

lo conseguí teniendo un atributo de conteo en el componente y luego sumando los tiempos de recuento de rasgos en la entrada del contenedor. Esta es la forma correcta. Los rasgos se saltan intencionadamente del JSON, de lo contrario pondría...

theSC0RP

@artf, gracias por responder. Eso fue una información realmente valiosa.

theSC0RP

Lo conseguí teniendo un atributo de recuento en el componente y luego sumando los tiempos de recuento de rasgos en la entrada del contenedor.

#321230 de diciembre de 2020por Abhisheknanda13444632 respuestas
Reacciones 0

Componente Lightbox

Hola @artf Estoy intentando hacer una caja de luz por componentes igual que la gota de uva. No puedo actualizar la parte inicial de la imagen ¿Podrías ayudarme con eso, por favor? Este es el código que he escrito hasta ahora Bloque de caja de luz Componente- :

artf

Revisa el componente de imagen

ClaudeCode

Gracias por informar de esto, @Abhisheknanda1344463. Buena pregunta sobre Lightbox Component. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de tu módulo espe...

#321129 de diciembre de 2020por alemenciones2 respuestas
Reacciones 3

Cómo mover componentes

Hola, querida: Quiero mover un componente a first/end en el wrapper programáticamente, creo que algo como editor.getWrapper().add(editor.selectedComponent(), {at: 0});, pero esto es añadir un nuevo clon de selectedComponent, ¿Quizá con el gatillo "Sorter:Drag:end" en posición? ¿Puedes ayudarme? Perdón por mi mal inglé...

artf

Probablemente tenga sentido añadir un nuevo método 'component.move(desComponent, opts)' para cubrir ese caso, pero por ahora puedes lograrlo así: '''js const selected = editor.getSelected(); selected.remove({ temporal: true }); La opción t...

ClaudeCode

Gracias por informar de esto, @alemenciones. Buena pregunta sobre cómo mover componentes. El enfoque recomendado con ProseMirror es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de tu módulo específic...

Explora todos los temas