ExtJS dynamic loading tree treepanel
1. Create a TreeStore and add the root node to copy the code Ext. define ('demo1. store. treedemostore', {extend: 'ext. data. treestore', root: {text: 'Directory tree', id: 0}); copy code 2. Add treepanel to view and bind TreeDemoStore to copy code Ext. define ('demo1. view. myviewport', {extend: 'ext. container. viewport', initComponent: function () {var me = this; Ext. applyIf (me, {items: [{xtype: 'treepanel ', id: 'treedemo', height: 500, store: 'treedemostore', autoScroll: true}]}); this. callParent (arguments) ;}}); copy code 3. Load the tree in the controller's onLaunch method to copy the code Ext. define ('demo1. controller. myController ', {extend: 'ext. app. controller ', init: function (application) {}, onLaunch: function () {// The list of request data (where the data is stored, you need to write it here) id: node id; text: node name; pid: parent node id var info = [{id: '1', text: 'second-level node 1', pid: '0 '}, {id: '2', text: 'second-level node 2', pid: '0'}, {id: '3', text: 'second-level node 3', pid: '0'}, {id: '4', text: 'level 2 node 1-Level 3 node 1', pid: '1'}, {id: '5', text: 'Level 2 node 1-Level 3 node 2', pid: '1'}, {id: '6', text: 'level 2 node 2-Level 3 node 1', pid: '2'}, {id: '7', text: 'level 2 node 2-Level 3 node 2', pid: '2'}, {id: '8', text: 'Level 2 node 2-Level 3 Node 1-Level 4 node 1', pid: '6'}, {id: '9', text: 'Level 2 node 2-Level 3 Node 1-Level 4 node 2', pid: '6'}]; var store = Ext. data. storeManager. lookup ('treedemostore'); var root = store. getRoot (); appendTreeChildNodes (root, 0, info) ;}}); // load the function appendTreeChildNodes (node, pid, infos) of the child node based on the parent node id) {var children = []; var childModel ={}; for (var I = 0; I <infos. length; I ++) {if (infos [I]. pid = pid) {childModel = {}; childModel. text = infos [I]. text; childModel. id = infos [I]. id; childModel. pid = infos [I]. pid; children. push (childModel); infos. splice (I, 1); I --;} node. appendChild (children); if (node. hasChildNodes () {node. eachChild (function (child) {appendTreeChildNodes (child, child. get ('id'), infos); // recursion});} else {node. set ('leaf', true );}