【前端】extjs的treepanel 后台并没有按照规定的结构返回数据时解决方案

背景：

    需要用treepanel写一目录选择的功能，但是后台接口早就写好，并且其他地方已经使用了，所以后台的数据格式不能改变。因为treepanel对于后台接口返回的数据格式是有要求的，所以就不能用原本的proxy交互的方式，只能先ajax将数据返回回来的时候，手动组成子节点，并push到父亲节点上。

 

代码：

var treeStore = Ext.create('Ext.data.TreeStore', {
            root: {
                children: [
                    {
                        id: clientId,
                        text: clientId,
                        path: ""
                    }
                ]
            },
            listeners : {
                'beforeexpand' : function(node,eOpts){
                    if(typeof (node.raw.path) != 'undefined'){
                        var pnode = treeStore.getNodeById(node.raw.id);
                        if(!pnode.hasChildNodes()){
                            var url = "XXXXXXXXXXXXXXXXXXXXXXXX";
                            var method = 'get';
                            Ext.Ajax.request({
                                url : url,
                                method : method,
                                headers : {
                                    "Accept" : 'application/json',
                                    "Content-Type" : 'application/json; charset=UTF-8'
                                },
                                success : function(response) {
                                    var result = null;
                                    if (response.responseText != "") {
                                        result = Ext.decode(response.responseText); // 返回的信息
                                    }
                                    if(result.data.length != 0){
                                        var newnode = [];
                                        for(var childrenNum = 0; childrenNum<result.data.length; childrenNum++){
                                            var onenode = {
                                                id: result.data[childrenNum].id,
                                                text:  result.data[childrenNum].name,
                                                path: result.data[childrenNum].path
                                            };
                                            newnode.push(onenode);
                                        }
                                        pnode.appendChild(newnode);
                                    }
                                }
                            });
                        }
                    }

                }
            }
        });
        var treePanel = Ext.create('Ext.tree.Panel', {
            width: 200,
            height: 300,
            store: treeStore,
            rootVisible: false,
            hideCollapseTool : true
        });

 

 

参考博客：

https://www.cnblogs.com/wql025/p/5040165.html

https://www.cnblogs.com/mrye/archive/2013/05/26/3100431.html