如何在Extjs中创建树

时间:2014-03-13 05:39:03

标签: extjs

由于我是Extjs的新手,我想知道使用它创建树。我需要一个简单的例子来创建一个root和一个子节点。任何人都可以帮助我吗?

1 个答案:

答案 0 :(得分:0)

如果您是Extjs的新手,您必须知道可以找到很多示例HERE。 有关静态树面板的示例,请参见下文:

要使树面板工作,首先需要一些数据。通过TreeStore实例加载数据将在内部解析关系并将所有与树相关的方法应用于模型实例。

<强> TreeStore

var store = Ext.create('Ext.data.TreeStore',{
    // Sets up root node
    root : {
        text: 'Root Node',
        expanded : true, // Expands true node on initialization
        children :[{ // Specifies child nodes
            text:'Child 1',
            leaf : true // Specifies node as leaf
        },{
            text:'Child 2',
            leaf : true
        },{
            text : 'Child 3',
            children: [{
                text : 'Grand Child 1',
                children : [{
                    text: 'etc.',
                    leaf : true
                }]
            }]
        }]
    }
});

<强> TreePanel中

Ext.create('Ext.window.Window',{
    title : 'Title window',
    layout: 'fit',
    autoshow : true,
    height : 200,
    width : 200,
    items : { // Here, you configure your tree panel
        xtype: 'treepanel',
        border : false,
        store : store, // Store created above
        rootVisible : true
    }
});

您还可以找到包含JSON文件HERE

的示例