Probleme beim Ziehen von externem HTML mit draggable="true"

Question

Ich möchte ein externes HTML-Element erstellen, das in GrapesJS gezogen werden kann, so wie man einen Block ziehen kann, und es fügt etwas hinzu. Ich habe ein Sample mit einer Div mit draggable="true", einer regulären Div und einem Bild. Das Bild zieht problemlos herein, und wenn du den Text der regulären Div auswählst und diesen hineinziehst, funktioniert es, aber die Div mit draggable="true" zieht nicht richtig hinein. Ich möchte, dass sich das Div genauso verhält wie die anderen beiden Eleme...

artf · Accepted Answer

@Davidvlv HTML5 D&D nicht so funktioniert, reicht das Hinzufügen von 'draggable="true"' nicht aus. Das sagt dem Browser nur: "Hey, du kannst mich ziehen!", aber du musst auch angeben, WAS du ziehen möchtest (mit der 'dataTransfer.setData' API). Hier ist dein Beispiel, erweitert mit der richtigen Einrichtung und der Verwendung von 'canvas:dragdata' (nur als Beispiel, in diesem Fall nicht notwendig). https://jsfiddle.net/artur_arseniev/87rcb24n/

sdrebel · Answer

Hast du das schon mal ausprobiert? editor = grapesjs.init({ ....... dragMode: 'absolut', // 'absolute' | 'übersetzen' ...... }) Außerdem kannst du für jede Komponente den Drag-Modus einstellen. https://grapesjs.com/docs/api/component.html#index

Davidvlv · Answer

Hallo @sdrebel

Das löst mein Problem nicht. Ich habe ein Video angehängt, das die jsfiddle zeigt – beachte, dass die Div mit draggable="true" nicht in den Editor gezogen wird. Trauben importieren draggable.zip

Probleme beim Ziehen von externem HTML mit draggable="true"

Frage

Antworten (3)

Verwandte Fragen und Antworten

Wie fügt man ein neues HTML-Element mit Inline-Stilen hinzu?

Wie löst man ein Ereignis aus, das component:selected mit meiner Komponente auslöst

Ich habe eine Komponente mit dem Namen Template in die Blöcke eingefügt, aber wenn ich versuche, andere Komponenten innerhalb dieser Vorlage zu ziehen, wird sie gezogen, aber nach dem Speichern werden alle darin enthaltenen Komponenten entfernt. Wie kann man das vermeiden?

ID ändert sich beim Import von HTML oder beim Weitergeben von HTML in Komponenten in der Konfiguration.

Kostenpflichtige Plugins, die diesem Problem entsprechen

Durchsuchen Sie Plugin-Kategorien