Extjs 6.7 TreeList 从远程存储无限加载数据答案

【问题标题】：Extjs 6.7 TreeList load data infinite from remote storeExtjs 6.7 TreeList 从远程存储无限加载数据
【发布时间】：2020-03-02 14:56:27
【问题描述】：

我尝试通过 ajax 代理使用远程数据填充树列表，但树列表仅显示第一级并尝试重新加载子级别，即使 json 响应包含完整的树结构。小提琴链接：https://fiddle.sencha.com/#view/editor&fiddle/33u9

当我尝试扩展节点“SUB a”（或将扩展属性设置为 true）时，商店会尝试重新加载节点。

为什么不支持来自 json 响应的树结构？

提前致谢。

后端响应如下：

{
  "data": {
    "root": [
      {
        "leaf": true,
        "text": "Server"
      },
      {
        "leaf": true,
        "text": "Storage"
      },
      {
        "text": "SUB a"
        "children": [
          {
            "leaf": true,
            "text": "Modul A - 1"
          },
          {
            "leaf": true,
            "text": "Modul A - 2"
          }
        ],
      },
      {
        "leaf": true,
        "text": "Modul B"
      }
    ]
  },
  "success": true
}

使用的阅读器配置是

reader: {
  type: 'json',
  rootProperty: 'data.root',
  successProperty: 'data.success',
},

【问题讨论】：

标签： extjs6

【解决方案1】：

玩完后，我使用以下解决方法：

getNavigation: function() {
var me = this,
  tree = me.getView().down('navigationtree'),
  store = tree.getStore(),
  node = store.getRoot();

Ext.Ajax.request({
  url: '/getnav',
  method: 'POST',

  success: function(response) {
    var obj = Ext.decode(response.responseText),
      childs = obj.data.root;

    tree.suspendEvents();
    node.removeAll();
    childs.forEach(function(item) {
      node.appendChild(item);
    });
    tree.resumeEvents();
  },
  failure: function(response) {
    //debugger;
    console.log('server-side failure with status code ' + response.status);
  }
}).then(function() {
    //debugger;
  }
);

}

有趣的是，只需添加树的第一层，所有后续子层都会自动添加。

【讨论】：