Issue #808💬 RespondidoAbierto el 26 de enero de 2018por austinbiggsReacciones 1

Crea espacio donde caería el componente

Respuesta rápidapor bogdansmadici1

Hola @austinbiggs, ¿alguna novedad sobre esto? ¡Gracias!

Lee la respuesta completa abajo ↓

Pregunta

Como menciona el título (que puede ser un poco confuso), tengo curiosidad por saber cómo crear un espacio donde caería un componente. Esto es muy común en implementaciones de arrastre/ordenación que he visto. (por ejemplo, https://shopify.github.io/draggable/ y jQuery Sortable)

Por lo que entiendo del marcador de caída (barra verde en el anexo), está en una "Capa" separada y en realidad vive fuera del lienzo. Quiero implementar un mejor marcador de drop, solo que no sé por dónde empezar al implementarlo.

Tengo una solicitud similar abierta respecto al marcador de DRAG, sin embargo, en este número me refiero al marcador de DROP.

El siguiente código tampoco devuelve lo que esperaría...

editor.on('sorter:drag:start', (src, srcModel) => {
	console.log( 'src: ', src );
	console.log( 'srcModel: ', srcModel );
})

! captura de pantalla 2018-01-26 a las 12:03:04 pm

Respuestas (3)

bogdansmadici7 de octubre de 2022

Hola @austinbiggs, ¿alguna novedad sobre esto?

¡Gracias!

artf29 de enero de 2018

Por lo que entiendo del marcador de caída (barra verde en el anexo), está en una "Capa" separada y en realidad está fuera del lienzo. Quiero implementar un mejor marcador de drop, solo que no sé por dónde empezar al implementarlo.

Exactamente, y la razón detrás de este enfoque es un mejor rendimiento (menos manipulaciones del DOM) y, en mi opinión, menos confuso, así que no tengo ninguna razón válida para empezar a trabajar en esta función. Si quieres empezar por tu cuenta, creo que el método onMove del Sorter es un buen punto de partida

alimajed9323 de julio de 2019

Hola @austinbiggs,

Me interesa la función que mencionaste antes, ¿alguna novedad? ¿Empezaste y lograste hacerlo?

Gracias.

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

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 →
Opción premium

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.