我定义了一个treepanel扩展扩展:’Ext.tree.Panel’和initComponent函数一样
Ext.define('Example',{
extend: 'Ext.tree.Panel',title: 'Example',useArrows:false,rootVisible: false,border: false,initComponent: function () {
var store = Ext.create('Ext.data.TreeStore',{
fields: [
{name: 'id',type: 'string'},{name: 'text',type: 'string'}
],autoLoad : false,// not working
proxy: {
type: 'ajax',url: 'data.PHP',reader: {
type: 'json',root: 'results'
}
}
});
this.store = store;
this.callParent(arguments);
}
});
我尝试设置autoLoad:false但是当我创建我的treepanel时总是加载
当我尝试配置下面的代码存储然后autoLoad:false工作但加载后我的treepanel是空白
root: {
text: 'Ext JS',id: 'src',expanded: false // this
}
如果不使用root配置,我的json很好并且正常工作
({ "results": [
{
id : '1',text : '1',expanded: true,results :[{
id : '2',text : '2',leaf:true
}]
},{
id : '3',text : '3',leaf:true
}]
})
如何解决这个问题.
您必须重写Ext.tree.Panel.setRootNode metod以考虑商店的autoLoad属性.
以下示例使用ExtJS v4.2.2进行测试.
Ext.define('Example',/**
* Override.
*/
setRootNode: function() {
if (this.getStore().autoLoad) {
this.callParent(arguments);
}
},proxy: {
type: 'ajax',url: '/data.PHP',root: 'results'
}
}
});
this.store = store;
this.callParent(arguments);
}
});
Ext.onReady(function(){
var tree = Ext.create('Example',{
renderTo: Ext.getBody(),width: 300,height: 300
});
tree.getStore().load();
});