1、準備工作

按照

搭建環境。

2、使用 TreeStore 獲取資料

      在前面，我們需要一個一個地寫子葉的內容，不僅麻煩也容易出錯，Ext.data.TreeStore 可以利用從後臺獲取資料為我們組裝一棵樹，我們只需要提供資料即可。這裡需要使用 JSON 和 Ajax 。

首先，為 TreePanel 配置一個 TreeStore，程式碼如下所示：

 <script>
        var tree = new Ext.tree.TreePanel({
                store: new Ext.data.TreeStore({
                    proxy: {
                        type: 'ajax',
                        url:'data.txt'
                    },
                    root:{text:'我是根'}
                })
            });
        tree.render('tree');
    </script>
 

執行後點擊效果如下所示：

注意，新建一個 data.txt 檔案，內容如下所示：

雖然已經有了效果，單不是我們想要的，節點可以無限展開，這時，我們將 root.expend(true,true) 改為 root.expend()，避免節點無限展開。