13

ExtJS 3.X には慣れていますが、ExtJS 4 には苦労しています。

グリッドの拡張を作成し、xtype でグリッドのインスタンスを使用できるようにしたいと考えています。私の知る限り、エイリアスを設定する必要widget.xtypenameがありますが、うまくいきません。

var MyGrid = Ext.define('mygrid', {
    extend:'Ext.grid.Panel',
    alias: 'widget.mygrid',
    // rest of grid...
});

Ext.create('Ext.window.Window', {
    title:'My Window',
    items:[{
        xtype:'mygrid'
    }]
})

Chromeコンソールで取得しているエラーはCannot create an instance of unrecognized alias: widget.mygrid

いくつかの助けは大歓迎です

4

5 に答える 5

12 
 Ext.define('MyApp.Grid',{
            extend: 'Ext.grid.GridPanel',
            alias: 'widget.mygrid',
            .......
            .......
            }

これで、xtypeとして使用できます：'mygrid'

于 2011-06-21T05:56:43.513 に答える
6

問題は、Ext.define の呼び出しの直後に、新しいクラスを使用するオブジェクトをインスタンス化しようとしている可能性があります。Ext.define は非同期プロセスであることを思い出してください。コンポーネントをインスタンス化する必要があるものはすべて、onReady ハンドラー、Ext.application (起動)、コンポーネント クラスの initComponent、またはコントローラー クラスの init にある必要があります。定義が完了しました。

「widget」で始まるエイリアスを指定します。xtype が期待される場所ならどこでも使用できます。簡単な例では、次のことを試してみてください。

var MyGrid = Ext.define('mygrid', {
    extend:'Ext.grid.Panel',
    alias: 'widget.mygrid',
    // rest of grid...
}, function() {
    Ext.create('Ext.window.Window', {
        title:'My Window',
        items:[{
            xtype:'mygrid'
        }]
    });
});

これにより、定義が完了した後、コールバック内でウィンドウがインスタンス化されます。

于 2011-06-30T08:12:02.533 に答える
4

MVC アプリケーションで作業している場合は、コントローラーにビュー情報を追加することでこれを修正できます。コントローラーでは、. という名前の配列でビューを指定する必要がありますviews。以下に例を示します。

 Ext.define('MyApp.controller.Users', {
    extend: 'Ext.app.Controller',
    views: ['users.List'],
    ...

あなたの場合、定義する必要があるかもしれませんviews:['mygrid']。

MVC アーキテクチャを使用していない場合は、 を使用してExt.require、グリッド クラスが存在することを指定する必要があります。

于 2011-05-10T08:55:11.710 に答える
4

構成に xtype を追加する必要があると思います。

var MyGrid = Ext.define('mygrid', {
    extend:'Ext.grid.Panel',
    alias: 'widget.mygrid',
    xtype: 'mygrid',
    // rest of grid...
});

さらに調査した後、必要なのはエイリアスだけであると思います。initComponent 関数を定義していますか? 以下は、Sencha の例です。

Ext.define('App.BookGrid', {
    extend: 'Ext.grid.Panel',
    // This will associate an string representation of a class
    // (called an xtype) with the Component Manager
    // It allows you to support lazy instantiation of your components
    alias: 'widget.bookgrid',

    // override
    initComponent : function() {
        // Pass in a column model definition
        // Note that the DetailPageURL was defined in the record definition but is not used
        // here. That is okay.
        this.columns = [
            {text: "Author", width: 120, dataIndex: 'Author', sortable: true},
            {text: "Title", flex: 1, dataIndex: 'Title', sortable: true},
            {text: "Manufacturer", width: 115, dataIndex: 'Manufacturer', sortable: true},
            {text: "Product Group", width: 100, dataIndex: 'ProductGroup', sortable: true}
        ];
        // Note the use of a storeId, this will register thisStore
        // with the StoreManager and allow us to retrieve it very easily.
        this.store = new App.BookStore({
            storeId: 'gridBookStore',
            url: 'sheldon.xml'
        });
        // finally call the superclasses implementation
        App.BookGrid.superclass.initComponent.call(this);
    }
});
于 2011-06-16T16:45:22.757 に答える
1

これも機能します：

Ext.define('Path.to.ClassUsingSubcomponent', {
...
requires: ['Path.to.YourSubcomponent'],
...

}
于 2013-01-28T11:05:24.833 に答える