Restringiendo la caída en el componente envolvente
Hola @BillTheGoat prueba esto después de init:
Lee la respuesta completa abajo ↓Pregunta
Versión: 0.16.22
¿Puedes reproducir el error de la demo?
[ ] Sí [X] No - requiere editar js.
¿Cuál es el comportamiento esperado? El componente envoltorio no debería ser 'droppable' una vez que el atributo 'droppable' esté configurado como 'false'.
¿Cuál es el comportamiento actual?' No ocurre nada cuando se activa este atributo.
Describe el error detallado Los componentes hijos pueden restringirse usando 'data-gjs-droppable=".foo"' o 'data-gjs-droppable="false"', pero este atributo no sirve de nada cuando se configura en el componente wrapper usando la API 'DomComponent'. He probado a añadirlos usando 'domComponents' en 'init', justo después de init, o esperar a que el editor 'onload' se encaje. He intentado usar atributos como 'droppable', 'data-droppable' y/o 'data-gjs-droppable'. El caso de uso para esto es asegurarse de que los usuarios no puedan eliminar elementos fuera de mi plantilla base, ya que estropearía el postprocesamiento. Soy nuevo en Grapejs pero no encuentro información sobre esto ni en Issues ni en StackOverflow/Google, etc.
¿Puedes adjuntar capturas de pantalla, screencasts o una demo en directo?
[X] Sí (adjuntar) [ ] No
https://codesandbox.io/s/kind-ritchie-5ue7i crea un envoltorio como:
'<div data-gjs-type="wrapper" draggable="true" data-highlightable="1" droppable="false" data-droppable="false" data-gjs-droppable="false" id="c55" class=""> ...'
Respuestas (3)
Hola @BillTheGoat prueba esto después de init:
editor.getWrapper().set({
'droppable': falso
});
Creo que es porque el envoltorio no forma parte de DomComponents. Los DomComponents son solo los componentes dentro del envoltorio. :sonríe:
Hmmm. Lo probé porque la documentación de la API indica DomComponents.getWrapper() como su primera función, y sí aplica atributos como se ve en mi sandbox anterior. Me pareció doblemente extraño porque parece que la función editor.getWrapper() es solo un envoltorio para editor.get("DomComponents").getWrapper() en la ;) fuente.
Edito: de hecho, el wrapper está dentro del ámbito domComponents init, así que esto funciona:
domComponents: {
envoltorio: {
Droppable: falso,
}
},
Muchas gracias por tu gran trabajo.
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #3418
El atributo "visible" de los paneles no impide el renderizado de los paneles
Versión: v0.17.3 ¿Puedes reproducir el error de la demo?[ ] Sí[x] No ¿Cuál es el comportamiento esperado? 'Editor. Panels.addPanel({id: 'te...
Issue #3134
Desplázate en el lienzo hasta la parte superior de la página cuando intento arrastrar un elemento de las últimas secciones
Versión: 0.16.27 ¿Puedes reproducir el error de la demo? [X] Sí [ ] No ¿Cuál es el comportamiento esperado? Cuando intento arrastrar un com...
Issue #3693
AdoptStylesheet no soportado en grapesJS
Versión: Puedes obtener la versión escribiendo 'grapesjs.version' en la consola 0.17.22 ¿Puedes reproducir el error de la demo?[x] Sí[ ] No...
Issue #3731
El elemento de texto no puede seleccionarse dos veces después de extenderse con eventos
Versión: 0.17.25 ¿Puedes reproducir el error de la demo?[ ] Sí[x] No ¿Cuál es el comportamiento esperado? Actualiza un componente existente...
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.