0

コンテナー内にリスト ビューがあり、フォーム パネル内、タブ パネル内に、レスト プロキシと json リーダーが正しく構成されています。Sench Architect 2 デザイン モードで表示すると、データ項目が表示され、スクロールできます。しかし、実行すると、画面のリスト部分が空白になり、上部にドッキングされた検索フィールドだけが表示されます。

私はこれを何時間もいじっていましたが、成功しませんでした。助けていただければ幸いです。

私のコードは次のとおりです。

Ext.define('MyApp.view.MyTabPanel', {
extend: 'Ext.tab.Panel',
alias: 'widget.MainTab',

config: {
    items: [
        {
            xtype: 'container',
            title: 'Customer',
            layout: {
                type: 'fit'
            },
            items: [
                {
                    xtype: 'formpanel',
                    scrollable: 'vertical',
                    items: [
                        {
                            xtype: 'container',
                            layout: {
                                type: 'fit'
                            },
                            items: [
                                {
                                    xtype: 'searchfield',
                                    placeHolder: 'Type customer name'
                                },
                                {
                                    xtype: 'list',
                                    docked: 'bottom',
                                    height: 431,
                                    ui: 'round',
                                    itemTpl: [
                                        '<div>{Name}</div>'
                                    ],
                                    store: 'CustomersStore',
                                    itemHeight: 25,
                                    striped: true
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            xtype: 'container',
            title: 'SKU'
        },
        {
            xtype: 'container',
            title: 'Invoice'
        },
        {
            xtype: 'container',
            title: 'Payment'
        }
    ]
}

});

4

2 に答える 2

0

理由は、フィット レイアウトのコンテナーで 2 つのコントロールを取得したためです。ここには 2 つのオプションがあります。オプション 1: 検索フィールドを上にドッキングする

// your code {
        xtype: 'container',
        layout: {
             type: 'fit'
        },
        items: [
            {
                  xtype: 'searchfield',
                  placeHolder: 'Type customer name',
                  docked: 'top'//Set docked top,
            },
            {
                 xtype: 'list',
                 docked: 'bottom',
                 height: 431,
                 ui: 'round',
                 itemTpl: [
                      '<div>{Name}</div>'
                 ],
                 store: 'CustomerStore',
                 itemHeight: 25,
                 striped: true
             }
     ]}

オプション 2: コンテナー vbox のレイアウトを設定し、flex を使用してリストの高さを定義する

{
                        xtype: 'container',
                        layout: {
                            type: 'vbox'//set layout style to vbox 
                        },
                        items: [
                            {
                                xtype: 'searchfield',
                                placeHolder: 'Type customer name'
                            },
                            {
                                xtype: 'list',
                                docked: 'bottom',
                                height: 431,
                                ui: 'round',
                                itemTpl: [
                                    '<div>{raceDate}</div>'
                                ],
                                store: 'MyNotes',
                                itemHeight: 25,
                                striped: true,
                                flex: 1//define height of list view
                            }
                        ]
                    }
于 2013-09-28T03:16:28.090 に答える
0

見つかった理由: コンソールは、「Origin .... is not allowed by Access-Control-Allow-Origin」があることを明らかにしたので、JsonP を使用する必要があると思います。

私が困惑しているのはhttp://localhost/...、REST サービスが を指している間に、この Sencha アプリを実行していることです。http://localhost:8080/...

では、なぜこれが別の起源と見なされるのでしょうか。

于 2013-09-23T10:05:57.633 に答える