Problem #2179✓ GelöstAug 2, 2019 geöffnetvon Afdallah3-Reaktionen

Wickle jeden Komponentenzug automatisch in die Leinwand mit einer anderen Komponente

Kurze Antwortvon Afdallah2

@pouyamiralayi habe ich es geschafft, das Problem zu lösen, indem ich die Komponente als Objekt gemacht habe. So. '''javascript result.content = { TagName: 'div', abnehmbar: wahr, // Kann es nicht entfernen draggable: true, // Kann es nicht bewegen kopierbar: true, // Kopieren/Einfügen deaktivieren Klassen: ['Containe...

Lesen Sie die vollständige Antwort unten ↓

Frage

Ich versuche sicherzustellen, dass jede Komponente in die Leinwand gezogen wird, um mit einer Spaltenkomponente umwickelt zu werden. Um das zu erreichen, nutze ich Canvas Event. Zuerst habe ich das Fensterereignis deaktiviert, um zu verhindern, dass das Standard-HTML-5-Drag-and-Drop-Ereignis ausgelöst wird. 'Canvas:Drop'-Event '''javascript ditor.on('canvas:drop', function (dataTransfer) { event.preventDefault() }) Der obige Code-Return-Fehler, der besagt, dass DataTransfer nicht definiert ist Soweit ich weiß, können wir anpassen, was wir mit 'result.content' auf die Canvas legen. So etwas wi...

Antworten (2)

👍 Am hilfreichstenAfdallahAug 2, 2019

@pouyamiralayi habe ich es geschafft, das Problem zu lösen, indem ich die Komponente als Objekt gemacht habe. So. '''javascript result.content = { TagName: 'div', abnehmbar: wahr, // Kann es nicht entfernen draggable: true, // Kann es nicht bewegen kopierbar: true, // Kopieren/Einfügen deaktivieren...

PouyamiralayiAug 2, 2019

Hallo zusammen! Das Event, das Sie suchen, ist dieses editor.on('block:drag:stop', Funktion (element) { element.replaceWith({ TagName:'div', style:{'border': '1px solid red'}, Komponenten: [Element] }) }) Beachte, dass ich hier einen rot umrandeten Div als Verpackung benutze; In deinem Fall ist es...

Verwandte Fragen und Antworten

Führe die Forschung mit ähnlichen Themendiskussionen fort.

Kostenpflichtige Plugins, die diesem Problem entsprechen

Kuratiert nach Themen-Schlüsselwörtern und Label-Relevanz, damit Sie schneller liefern.

Alle Plugins anzeigen

Lade: Empfehlungen für kostenpflichtige Plugins...

Kostenlose Option

Überprüfen Sie die Open-Source-GrapesJS-Plugins auf GitHub Oder suchen Sie schnell in unserem kostenlosen Katalog.

Durchstöbere kostenlose Plugins →
Premium-Option

Premium-Plugins werden mit Support, regelmäßigen Updates und produktionsreifen Funktionen geliefert – das spart Tage an Integrationsarbeit.

Durchsuchen Sie Premium-Plugins →

Durchsuchen Sie Plugin-Kategorien

Springe direkt zu den Plugin-Kategorieseiten im Marktplatz.