ExtJS樹是一個常用的UI組件,可以用于展示樹形結構的數據。在使用ExtJS樹時,需要傳入數據,而更多的情況下,我們需要從后端獲取json數據。接下來,我們將介紹如何利用ExtJS樹獲取json數據。
首先,在ExtJS中,我們可以通過Ext.data.TreeStore來獲取json數據。例如:
Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: 'tree.json' }, root: { expanded: true } });
其中,type為ajax表示使用ajax方式獲取數據,url為后端的請求地址,root為設置根節點,這里設置為expanded為true,表示默認展開。
接下來,我們需要創建Ext.tree.Panel來顯示樹形結構。例如:
Ext.create('Ext.tree.Panel', { title: 'ExtJS Tree', store: Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: 'tree.json' }, root: { expanded: true } }), rootVisible: false, renderTo: Ext.getBody() });
其中,store同上述例子,rootVisible為false,表示不顯示根節點,最后將tree.Panel渲染到頁面上。
以上就是利用ExtJS樹獲取json數據的方法,通過TreeStore可以輕松獲取json數據,并使用Tree.Panel進行展示。