dojo drag n drop（DND）不起作用

Question

我有dojo樹和可以添加到樹中的項目列表。想要使用dojo dnd（拖放n拖放），以便列表中的項目可以拖動到樹上添加它們。

這裏是什麼，我試圖做一個例子： jsfiddle example

當在未分配列表項你按下鼠標，並將其拖動到樹，好像沒有任何反應，但如果你看看在Web瀏覽器控制檯中，您可以看到它始終在dojo的Memory.js模塊中抱怨TypeError: a is undefined。

我正在嘗試類似於此示例Dojo drag-n-drop example。在本例中，從items列表中獲取一個項目，並將其拖到右側的樹（集合樹）上。

我使用dojo 1.10.4，也是使用樹和拖放（dojo dnd）的新功能。我在這裏錯過了什麼，能夠從列表中拖放到樹上？

Answer 1

我在屏幕的左側使用了Dojo Tree，在右側的列表中使用了Dragula（https://github.com/bevacqua/dragula）。這是非常簡單的，它的工作原理。

這裏有與Dragula列表對象的例子。

this.dnd = dragula([this.list], { 
     isContainer: function (el) { 
     return el.classList.contains('dijitTreeRow'); 
     } 
    }); 
    this.dnd.on('shadow', function (el, container, source) {   // the event when yoi drag something tipo hover 
    // console.log(el, container); 
     var oldContainer;           // change color of the drop item 
     oldContainer = query('.dndHover')[0]; 
     if (oldContainer) {          
     domClass.remove(oldContainer, 'dndHover'); 
     } 
     if (container === source) {        // if drag and drop on the list do nothing 
     return; 
     } 
     domClass.add(container, 'dndHover');     // highlight current node 
    }); 



    this.dnd.on('drop', function (el, container, source) {   // drop event 
     var oldContainer;           // remove highlight 
     oldContainer = query('.dndHover')[0]; 
     if (oldContainer) { 
      domClass.remove(oldContainer, 'dndHover'); 
     } 
     if (container !== source) { 
      // var widget = registry.getEnclosingWidget(el); 
      var target = registry.getEnclosingWidget(container); 
      // console.log(el, target); 

      // target = TREE NODE 
      // make your action (query, etc..) 

     } 
    }.bind(this)); 

CSS：

.dndHover{ 
    background-color: #52D017 !important; 
} 

.dijitTreeRow .dragdiv { 
    display: none; 
}