5

Sencha Architect 2を使用しています。テキスト検索と結果を表示するテーブルを使用して、汎用UI要素を生成しようとしています。Genericとは、ユーザー、ロール、その他のさまざまなタイプの検索に使用したいことを意味します。

したがって、Sencha Architect 2についてこのコンテキストで私が間違いなく気に入っているのは、常にクラスを生成することです。これが私の生成されたクラスです：

Ext.define('ktecapp.view.ObjSearchPanel', {
    extend: 'Ext.container.Container',
    alias: 'widget.objsearchpanel',

    height: 250,
    id: 'UserSearchPanel',
    itemId: 'UserSearchPanel',
    width: 438,
    layout: {
        columns: 3,
        type: 'table'
    },

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'textfield',
                    itemId: 'txtSearchText',
                    fieldLabel: 'Search Text',
                    colspan: 2
                },
                {
                    xtype: 'button',
                    id: 'searchObj',
                    itemId: 'searchObj',
                    text: 'Search',
                    colspan: 1
                },
                {
                    xtype: 'gridpanel',
                    height: 209,
                    itemId: 'resultGrid',
                    width: 430,
                    store: 'UserDisplayStore',
                    colspan: 3,
                    columns: [
                        {
                            xtype: 'gridcolumn',
                            width: 60,
                            dataIndex: 'ID',
                            text: 'ID'
                        },
                        {
                            xtype: 'gridcolumn',
                            width: 186,
                            dataIndex: 'DISPLAYNAME',
                            text: 'Displayname'
                        },
                        {
                            xtype: 'gridcolumn',
                            width: 123,
                            dataIndex: 'JOBTITLE',
                            text: 'Job Title'
                        },
                        {
                            xtype: 'actioncolumn',
                            width: 35,
                            icon: 'icons/zoom.png',
                            items: [
                                {
                                    icon: 'icons/zoom.png',
                                    tooltip: 'Tooltip'
                                }
                            ]
                        }
                    ],
                    viewConfig: {

                    },
                    selModel: Ext.create('Ext.selection.CheckboxModel', {

                    })
                }
            ]
        });
        me.callParent(arguments);
    }
});

私が抱えている問題は、すべてがかなりカスタマイズ可能である必要があることです。列のdataIndexes、ストアなどです。では、すべての情報を渡すクラスObjSearchPanelの関数のようなコンストラクターを取得するにはどうすればよいですか？上記のコードでは、これはほとんどハードコーディングされているように見えます...

よろしくお願いしますカイ

4

2 に答える 2

8

構成を使用し、

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Class-cfg-config

Ext.define('SmartPhone', {
     config: {   
         hasTouchScreen: false,
         operatingSystem: 'Other',
         price: 500
     },
     constructor: function(cfg) {
         this.initConfig(cfg);
     }
});

var iPhone = new SmartPhone({
     hasTouchScreen: true,
     operatingSystem: 'iOS'
});

iPhone.getPrice(); // 500;
iPhone.getOperatingSystem(); // 'iOS'
iPhone.getHasTouchScreen(); // true;
iPhone.hasTouchScreen(); // true
于 2012-05-02T10:10:54.707 に答える
4

実際 (ExtJS 4 では)、構成オブジェクトをコンストラクターに渡すと、この構成オブジェクトはthis.initialConfig変数に割り当てられ、クラスの他の関数で引き続き使用できます。そのため、で使用できますinitComponent。

ExtJS 3.3 では、このようなコードを of クラスで見つけることができExt.apply(this, Ext.apply(this.initialConfig, config));ますinitComponent。ただし、これは ExtJS 4 のドキュメントにはなく、ソース コードにのみ記載されているため、自己責任で使用してください。

于 2012-05-05T02:30:23.210 に答える