如何选中/取消选中树面板的所有节点，然后仅在 extjs 中向服务器发送请求？

Question

我是新手extjs，我使用过树面板。我已经编写了用于检查和取消选中树控件复选框的代码。我有类似下面的树结构。|-Parent 1    |- Child 1    |- Child 2        |- Sub child 2.1        |- Sub child 2.2    |- Child 3    |- Child 4        |- Sub child 4.1        |- Sub child 4.2    |- Child 5    |- Child 6|-Parent 2    |- Child 1    |- Child 2        |- Sub child 2.1    |- Child 3在听者，我已经写代码，用于检查和取消选中的节点，可以说，如果所有的节点都选择和用户取消选中Sub child 2.3，然后Child 2和Parent 1两个得到取消选中，并且工作正常。现在的问题是每当这个检查/取消检查事件发生时，它都会触发一个数据库调用。我想让它像一次让它完成所有检查/取消检查操作，然后单次而不是每次都进行数据库调用。我很困惑如何让它发生？下面是相同的代码。items: [    Ext.create('Ext.tree.Panel', {        checkPropagation: 'both',        itemId: 'datasourceCustodianTree',        rootVisible: false,        store: {            fields: ['value'],            root: {                expanded: true,                children: treeData,                text: 'Source:',            }        },        listeners: {            checkchange: function (node, checked, options) {                var list1 = [], list2 = [], list3 = [];                var tree = me.down('#datasourceTree');                // Propagate change downwards (for all children of current node).                var setChildrenCheckedStatus = function (current) {                    if (current.parentNode) {                        var parent = current.parentNode;                        current.set('checked', parent.get('checked'));                        suspendEvent = true;                    }                    if (current.hasChildNodes()) {                                                                        current.eachChild(arguments.callee);                    }            }        }    })]如何进行这样的操作？我已经尝试制作suspendEvent('checkchange');并在它之后resumeEvent('checkchange')。但这不起作用，因为它只会调用此事件一次。现在我无能为力，该怎么办？

Answer 1

适用于 extangular。

在组件 UI 上

 <ExtTree fitToParent="true" cls="red-node-text" [store]="treeStore" (select)="onSelect($event)" (checkchange)="onCheckchange($event)">

        </ExtTree>

在组件 ts 上

onCheckchange = ({ cell, checked, record, e }) => {     

 if(record.hasChildNodes()){

      record.eachChild(function(n){n.set('checked', checked);} );

    }

};

Answer 2

为此，您不需要 extjs 的任何技巧。只需设置一个像这样的控制变量，以便事件处理程序仅在手动选中/取消选中操作后工作。

checkchange: function(){

    if(this._suspendCheckChange){

        return;

    }

    this._suspendCheckChange = true;

    // your check/uncheck logic

    // ...

    this._suspendCheckChange = false;

}

Answer 3

我已经调查过，问题出在我的代码中。我使用了一个我不知道它会做什么的属性，我已经删除了该属性。删除了这个属性，一切正常。checkPropagation: 'both'