2

ビューでツリー パネルを使用しようとすると、上記のエラーが発生します。以下にコードを示します。

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'
}]
});

アイデアが不足しています。ありがとうございました。

4

1 に答える 1

1

いくつかのこと...

  1. Adminコントローラーにストアが 含まれていません。storeには が必要なTreeので、その参照が失敗している場合は、それが問題である可能性があります。
  2. inに追加itemsしていますが、意味がありません。ツリーの構成は既に にあるため、設定はツリー パネル内に新しいネストされた項目を追加しています。これはあなたが望むものではありません。treeinitComponentExt.definethis.items = ...
  3. alias私のコメントで述べたように、とxtypein の両方を使用しないでくださいExt.define

ツリーに特定の追加機能を追加する必要がなく (現在のコードが示唆している)、それを 1 回しか使用しない場合 (これが当てはまるかどうかは不明)、treeなしで の単一のインスタンスを使用することもできます。別のクラスを定義します。

{
    xtype: 'treepanel',
    store: 'Admin',   //still make sure this is defined in controller or "requires" config
    useArrows: true,
    title: 'Admin Functions',

    region:'west',
    margins: '5 0 0 5',
    width: 200,
    collapsible: true,   // make collapsible
    id: 'west-region-container',
    layout: 'fit'
}
于 2013-09-10T12:33:22.253 に答える