Extjs 拖放会停止对已拖动的项目的操作

我在页面的容器A中有一个ExtJS树面板，还有另一个容器B

treepanel通过Ajax调用使用项进行初始化。在treepanel的

viewConfig

中，我添加了

itemadd

事件侦听器，在其中我将添加的项注册为DragSource。以下是treepanel的

viewConfig

中的

itemadd

事件侦听器

'itemadd': function(records, node){
    // Iterate over each child record of parent node in treepanel.
    Ext.each(records, function(record){
        var dragSource,
            field,
            fieldId;
        field = Ext.query('[id='+record.data.listId+']')[0]; // I've manually added 'listId' which has unique value gained from Ext.id() for each record item.
        fieldId = field.id;
        dragSource = new Ext.dd.DragSource(field, {
            isTarget  : false
        });

        dragSource.dragData = {
            record: record
        };
    });
}

在容器B的项目中，我添加了一个名为

MyView

的视图，该视图在内部扩展了

Ext.Container.Container

。因此，在容器B的

afterrender

中，我将自己注册为

DropTarget

。我是这样做的

'afterrender': function(containerMain) {
    var dropZone,
        myView = Ext.ComponentQuery.query("myview")[0];

    dropZone = new Ext.dd.DropTarget(containerMain.getEl()); // Register Container B as DropTarget.

    dropZone.notifyDrop = function(source, event, params) {
        myView.doSomething(params.record); // This method will handle data of dropped record and internally show something on UI.
    };
}

现在，这里的问题在逐步使用中描述

• 我第一次从treepanel中将一个项目拖到容器B中，它可以正常工作。
  • 我不允许将重复的项目再次添加到

    MyView

    ，我为添加的每个项目都有一个删除按钮，以将其从MyView中删除
• 我删除我添加的项目
• 我试图再次从treepanel中拖动它，但它不再是可拖动的项目。
  • 虽然我仍然可以从同一个树面板中拖动另一个项目并添加它，但不是我之前添加和删除的第一个项目（我曾经添加到

    MyView

    的所有项目都会发生同样的情况）。请注意，删除项目不是重现问题的必要条件，只是添加它会导致此问题

那么这里出了什么问题

---

任何帮助都会很好。

我建议使用

Ext.tree.plugin.TreeViewDragDropView

（

ptype:treeviewdragdrop

）插件，而不是手动处理它

树面板示例：

var treePanel = Ext.create('Ext.tree.Panel', {   
    (...),
    viewConfig: {
        plugins: {
            ptype: 'treeviewdragdrop',
            ddGroup: "sameGroup",
            enableDrop: false
        }
    }
});

小组成员：

var panel = Ext.create('Ext.panel.Panel', {
    (...),
    listeners: {
        'afterrender': function(component) {
            var dropZone = Ext.create('Ext.dd.DropTarget', component.body.dom, {
                ddGroup: 'sameGroup',
                notifyDrop: function(source, event, params) {
                    var myView = panel.up('myview');
                    myView.doSomething(source, event, params);
                    return true;
                }
            });                         
        }
    }
});