如何选中/取消选中树面板的所有节点，然后仅在 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 上&nbsp;<ExtTree fitToParent="true" cls="red-node-text" [store]="treeStore" (select)="onSelect($event)" (checkchange)="onCheckchange($event)">&nbsp; &nbsp; &nbsp; &nbsp; </ExtTree>在组件 ts 上onCheckchange = ({ cell, checked, record, e }) => {&nbsp; &nbsp; &nbsp;&nbsp;if(record.hasChildNodes()){&nbsp; &nbsp; &nbsp; record.eachChild(function(n){n.set('checked', checked);} );&nbsp; &nbsp; }};

Answer 2

为此，您不需要 extjs 的任何技巧。只需设置一个像这样的控制变量，以便事件处理程序仅在手动选中/取消选中操作后工作。checkchange: function(){&nbsp; &nbsp; if(this._suspendCheckChange){&nbsp; &nbsp; &nbsp; &nbsp; return;&nbsp; &nbsp; }&nbsp; &nbsp; this._suspendCheckChange = true;&nbsp; &nbsp; // your check/uncheck logic&nbsp; &nbsp; // ...&nbsp; &nbsp; this._suspendCheckChange = false;}

Answer 3

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