简单例子:
var store = Ext.create('Ext.data.TreeStore', {
root: { expanded: true, text: "", user: "", status: "", children: [ { text: "detention", leaf: true }, { text: "homework", expanded: true, children: [ { text: "book report", leaf: true }, { text: "alegrbra", leaf: true } ] }, { text: "buy lottery tickets", leaf: true } ] } });Ext.create('Ext.tree.Panel', {
title: 'Simple Tree', width: 200, height: 150, store: store, rootVisible: true, renderTo: Ext.getBody() });多列树:
Ext.create('Ext.tree.Panel', {
title: 'Simple Tree', width: 400, height: 300,rootVisible: true,
renderTo: Ext.getBody(), useArrows: true, fields: ['name', 'description'], columns: [{
xtype: 'treecolumn', text: '名称', dataIndex: 'name', flex: 1, sortable: true}, { text: '描述', dataIndex: 'description', flex: 1, sortable: true } ], root: { name: 'sss', description: '树根描述', expanded: true, text: "asd", user: "", status: "", children: [ { name: "detention", leaf: true }, { name: "homework", expanded: true, description: 'sss', children: [ { name: "book report", leaf: true, description: 'book表述' }, { name: "alegrbra", leaf: true, description: 'asdasd' } ] }, { name: "buy lottery tickets", leaf: true } ] }
});
分级加载树节点
Ext.regModel('Info', {
fields: ['iid', 'name', 'count']
});
var store = new Ext.data.TreeStore({
model: 'Info',
nodeParam: 'iid', proxy: {type: 'ajax',
url: 'Handler.ashx', reader: 'json'},
autoLoad: true, root: { name: 'root', id: '-1'}
})
Ext.create('Ext.tree.Panel', {
title: 'demo',
renderTo: Ext.getBody(), width: 300, height: 500, columns: [{ xtype: 'treecolumn', text: 'cname', dataIndex: 'name', width: 200, sortable: true }, { text: 'pcount', dataIndex: 'count', flex: 1, sortable: true}
],
store: store, rootVisable: false})