ビューでツリー パネルを使用しようとすると、上記のエラーが発生します。以下にコードを示します。
List.js
Ext.define('AM.view.main.List', {
extend: 'Ext.tree.Panel',
alias: 'widget.adminlist',
requires: [
'Ext.tree.*',
'Ext.data.*'
],
xtype: 'tree-xml',
title: 'Admin Functions',
useArrows: true,
store: 'Admin',
initComponent: function() {
this.items = [
{
title: 'Admin Functions',
useArrows: true
}
];
this.callParent(arguments);
}
});
いくつかのバリエーションを試しましたが、それでも同じエラーが発生します。以下は店舗コードです。
Admin.js
Ext.define('AM.store.Admin', {
extend: 'Ext.data.TreeStore',
root: {
expanded: true,
children: [
{
text: 'app',
children: [
{ leaf:true, text: 'Application.js' }
]
},
{
text: 'button',
expanded: true,
children: [
{ leaf:true, text: 'Button.js' },
{ leaf:true, text: 'Cycle.js' },
{ leaf:true, text: 'Split.js' }
]
},
{
text: 'container',
children: [
{ leaf:true, text: 'ButtonGroup.js' },
{ leaf:true, text: 'Container.js' },
{ leaf:true, text: 'Viewport.js' }
]
},
{
text: 'core',
children: [
{
text: 'dom',
children: [
{ leaf:true, text: 'Element.form.js' },
{ leaf:true, text: 'Element.static-more.js' }
]
}
]
},
{
text: 'dd',
children: [
{ leaf:true, text: 'DD.js' },
{ leaf:true, text: 'DDProxy.js' },
{ leaf:true, text: 'DDTarget.js' },
{ leaf:true, text: 'DragDrop.js' },
{ leaf:true, text: 'DragDropManager.js' },
{ leaf:true, text: 'DragSource.js' },
{ leaf:true, text: 'DragTracker.js' },
{ leaf:true, text: 'DragZone.js' },
{ leaf:true, text: 'DragTarget.js' },
{ leaf:true, text: 'DragZone.js' },
{ leaf:true, text: 'Registry.js' },
{ leaf:true, text: 'ScrollManager.js' },
{ leaf:true, text: 'StatusProxy.js' }
]
},
{
text: 'core',
children: [
{ leaf:true, text: 'Element.alignment.js' },
{ leaf:true, text: 'Element.anim.js' },
{ leaf:true, text: 'Element.dd.js' },
{ leaf:true, text: 'Element.fx.js' },
{ leaf:true, text: 'Element.js' },
{ leaf:true, text: 'Element.position.js' },
{ leaf:true, text: 'Element.scroll.js' },
{ leaf:true, text: 'Element.style.js' },
{ leaf:true, text: 'Element.traversal.js' },
{ leaf:true, text: 'Helper.js' },
{ leaf:true, text: 'Query.js' }
]
},
{ leaf:true, text: 'Action.js' },
{ leaf:true, text: 'Component.js' },
{ leaf:true, text: 'Editor.js' },
{ leaf:true, text: 'Img.js' },
{ leaf:true, text: 'Layer.js' },
{ leaf:true, text: 'LoadMask.js' },
{ leaf:true, text: 'ProgressBar.js' },
{ leaf:true, text: 'Shadow.js' },
{ leaf:true, text: 'ShadowPool.js' },
{ leaf:true, text: 'ZIndexManager.js' }
]
}
});
コントローラーのコードも以下に示します。
ユーザー.js
Ext.define('AM.controller.Users', {
extend: 'Ext.app.Controller',
stores: [
'Users'
],
models: ['User'],
views: [
'main.Body',
'main.List',
'user.List',
'user.Edit'
],
init: function() {
this.control({
'mainbody > userlist': {
itemdblclick: this.editUser
},
'useredit button[action=save]': {
click: this.updateUser
}
});
},
editUser: function(grid, record) {
var view = Ext.widget('useredit');
view.down('form').loadRecord(record);
},
updateUser: function(button) {
var win = button.up('window'),
form = win.down('form'),
record = form.getRecord(),
values = form.getValues();
record.set(values);
win.close();
// synchronize the store after editing the record
this.getUsersStore().sync();
}
});
以下で参照されているビューも参照してください。
Body.js
Ext.define('AM.view.main.Body' ,{
extend: 'Ext.panel.Panel',
alias: 'widget.mainbody',
layout: 'border',
title: 'Administrator Profile',
width: 500,
height: 300,
store: ['Users', 'Admin'],
items: [{
title: 'South Region is resizable',
region: 'south', // position for region
xtype: 'panel',
height: 100,
split: true, // enable resizing
margins: '0 5 5 5'
},{
// xtype: 'panel' implied by default
region:'west',
xtype: 'adminlist',
margins: '5 0 0 5',
width: 200,
collapsible: true, // make collapsible
id: 'west-region-container',
layout: 'fit'
},{
title: 'Center Region',
region: 'center', // center region is required, no width/height specified
xtype: 'userlist', //this is displaying the gridview
layout: 'fit',
margins: '5 5 0 0'
}]
});
アイデアが不足しています。ありがとうございました。