ELEMENT-UI Tree structure Lazy loading

In the actual project, often the tree structure data is large, then the tree node must be lazy loading

Lazy loading of the Element-ui tree:

<div style= "Width:100%;height:420px;overflow:auto;" >                        <el-tree lazy:load= "getorglist":p rops= "Defaultprops" highlight-current @node-click= "Handlenodeclick" >                        </el-tree></div>

The JS code is as follows:

defaultprops: {                    "Children",                    "name"                },

The tree node form is:

[        {            "id": "1",            "name": "State Grid",            null,            null  ,            "Children": []        }    ]

The Getorglist method is as follows:

/** Lazy Loading tree Gets the organization child node * Element-tree use * @param node: Current click Node information * @param Resolve: Passing Parameter method **/getorglist (node,resolve) {/*This . $http. Get (' ${process.env.node_env}/admin/org/selectall ') and then ((response) = {                    This.data2 = Response.data.data;                    }). catch (function (error) {Console.log (error); });*/ Let Self= This;                Console.log (node); if(Node.level = = 0{self. $http. Get (' ${process.env.node_env}/admin/org/selectall '). Then (res-= {Let Treedata =[] Res.data.data.forEach (E={Treedata.push (e)}) resolve (Treedata); }).Catch(res ={Resolve ([]); })                }Else{Console.log ("The current Node ID value is:" +node.data.id) self. $http. Get (' ${process.env.node_env}/admin/org/selectall/${node.data.id} '). Then (res ={Let myList= []; Res.data.data.forEach (e={Mylist.push (e)}) resolve (myList); }).Catch(res ={Resolve ([]); })                }            },

The Handlenodeclick method is as follows:

                        // Click Tree             Handlenodeclick (data) {                Console.log ("Click Tree Node");                Console.log (data);                 this. clicktree = data;            },                    

ELEMENT-UI Tree structure Lazy loading