Extjs 4 解释拖放如何实现跨两个网格或树形面板

Question

使用 Extjs 4.07

假设我有两个 treePanel，或者更有可能是两个网格。我希望能够在两者之间来回拖动项目。执行此操作所需的基 native 制是什么？我想看看一些演示它是如何完成的示例代码。我无法找到关于如何执行此操作的适用于 v4 而不是 v3 的良好文档。我知道有一种简单的方法，而且我找到了许多文档来解释这样做的臃肿方法。我不明白 dd 一般是如何实现的。因此，高级概述也很有用。

Answer 1

一个网格有一个 DragDrop插件，而一棵树有 TreeViewDragDrop插入。

如果您想从网格或树中拖动或拖动到网格或树中，请包含该插件。在网格的情况下，它看起来像这样:

Ext.create('Ext.grid.Panel', {

    ...

    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        }
    },

    ...

});

一旦包含插件，您就可以从组件中获得拖放事件，您可以监听这些事件。完成上面的例子。

Ext.create('Ext.grid.Panel', {

    …

    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        },

        listeners: {
            drop: function(node, data, dropRec, dropPosition) {
                // Do something here.
            }
        }        
    },

    …

});

你可以看到这个完全正常工作 in this example ，及其对应的 code .

据我所知，4.07 和 4.1 之间在这方面没有任何变化；