Desactivar la función de arrastre, no la habilidad
Bueno, en el propio componente, cuando haces clic en mover icono, ejecuta el comando 'tlb-move', así que puedes sobrescribirlo añadiendo uno nuevo con el mismo ID, pero desafortunadamente no hay una forma sencilla de cambiar el comportamiento de arrastre de los bloques. PD. Empecé a trabajar en el modo Diseñador, el d...
Lee la respuesta completa abajo ↓Pregunta
Quiero crear mis propias habilidades de arrastre y colocación. Me encantan grapesjs, pero realmente quiero tener más control sobre cómo funcionan los elementos arrastrados en el área de edición. ¿Hay alguna forma de desactivar el método incorporado para poder crear el mío propio? Sé que el modo diseñador está en la hoja de ruta, pero necesito la función ahora, así que la voy a añadir yo mismo, pero primero necesito evitar que la función predeterminada de grapesj interfiera con ella. Ya tengo los elementos de posicionamiento y redimensionamiento de arrastre funcionando perfectamente en mi propia app personalizada, así que sé que puedo hacerlo funcionar si encuentro la forma de evitar que la funcionalidad nativa de grapesjs interfiera.
No creo que sea tan sencillo como hacer: data-gjs-draggable="false"
Además, quizá haya alguna forma de dejar eso como verdadero y anular la función que lo gestiona.
Ahora mismo estoy usando las clases arrastrables/redimensionables de jquery para hacerlo con mi propia app. Simplemente envolvo cualquier elemento que añado para que sea seleccionable y editable:
función make_modifiable() {
console.log('ahora modificable');
$('.pub_element').arrastrable({
start: function() {
setCurrent($(this));
},
stop: function() {
update_html();
},
Contención: "padre",
cancelar: falso
}).resizeable({
start: function() {
setCurrent($(this));
},
stop: function() {
update_html();
},
Nombres: "todos"
});
}
$(".add_element").on("click", function() {
var element = $(this).attr('id');
var dyn_e = botones[elemento];
si (dyn_e != indefinido) {
var el = $("<div class='pub_element'></div>");
el.append($(dyn_e));
el.appendTo($(".cvtr-modal"));
}
make_modifiable();
});
Agradezco cualquier consejo y todo vuestro gran trabajo en este proyecto. Espero que otros con más experiencia en este proyecto puedan compartir ideas conmigo sobre él. Hay un par de proyectos geniales que ya tienen esta función, pero ni siquiera se acercan a grapesjs en documentación, UX/UI y capacidades, así que espero poder crear esta funcionalidad para mí y para otros para usarla con grapesjs.
Respuestas (2)
Bueno, en el propio componente, cuando haces clic en mover icono, ejecuta el comando 'tlb-move', así que puedes sobrescribirlo añadiendo uno nuevo con el mismo ID, pero desafortunadamente no hay una forma sencilla de cambiar el comportamiento de arrastre de los bloques.
PD. Empecé a trabajar en el modo Diseñador, el desarrollo es lento pero al menos empezó, espero publicar pronto algún número de seguimiento
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1902
[PREGUNTAS] Desactivar/cambiar el comportamiento de los componentes integrados
Hola, Intentando conseguir trabajo de GrapesJ para un proyecto en el que estoy trabajando actualmente. ¿Pero hay alguna forma de desactivar...
Issue #837
[PREGUNTA] Suprime JavaScript
Cada vez que importo, usando un plugin de importación, se borra parte del código en javascript. ¿Hay alguna forma de conservarlo? Quiero us...
Issue #1485
¿Cómo evitar estilizar componentes html?
Estoy intentando crear algunas plantillas que no deberían ser editables ni estilizables. Así que cuando arrastre mis bloques deberían mante...
Issue #1176
Sectores de estilo
Hola @artf ¿hay alguna forma de configurar los sectores de estilo para diferentes dispositivos, móvil y escritorio? Quiero desactivar los s...
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.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.