(Drag & Drop) Dragula.js funktioniert nicht beim erneuten Aufrufen der Route (in der ember.js App)

Question

Ich verwende dragula.js Bibliothek in einer ember.js Web App.

Dinge funktionieren gut (in der Lage, Dinge zu ziehen und fallen), bis ich revisit the route, nach dem drag and drop just stops working, das heißt, kann nichts ziehen, was zuvor ziehbar war. Und es gibt keine js Fehler in der Konsole. Dann aktualisiere ich die Seite (von jeder Route), es funktioniert wieder.

Kurz gesagt, die drag n drop funktioniert nur zum ersten Mal, wenn die Route besucht/geladen wird.

Dinge, die ich versucht:

• Bestätigte wenn die DOM items drag n fallen gelassen werden, werden zu dragula config.containers ist.
• Versucht, die Komponente von didInsertElement Element innerhalb der Laufschleife läuft in afterRender.

didInsertElement(){ this._super(...arguments); Ember.run.scheduleOnce('afterRender', this,() => { let drake = window.dragula(this.getDraggableContainers(), this.get('dragulaConfig')); this.set("drake", drake); }

Für mich scheint es, wie die dragula Bibliothek mit allen erforderlichen Konfigurations initialisiert wird, aber ich bin verwirrt, warum seine nicht richtig, nachdem die Strecke arbeiten erneuten Besuch.

Jede Hilfe/Zeiger würde sehr geschätzt werden. Vielen Dank!

Answer 1

Ich fand endlich etwas Zeit, um eine Antwort auf meine eigene Frage zu posten. Yay!

Grund:

Die Knotenreferenzen waren ungültig oder in anderen Worten ausgedrückt, nicht in dem DOM gefunden werden können, weil die Knoten Referenzen in meinem didInsertElement Haken auf den im vorherigen Besuch erstellt Knoten zeigt wurden die Route und bei jedem weiteren Besuch derselben Route/Seite werden die DOM-Knoten von ember (natürlich :) neu erstellt.

Lösung:

Statt Speicherung/Zwischenspeicherung der DOM-Knoten Referenzen, ein frischen DOM-Knoten Bezug auf den erforderlichen Knoten Bedarf auf jeder Strecke Besuch geholt werden. Auf diese Weise haben Sie immer gültige Knotenreferenzen.