0

サーバーにGETリクエストを送信するjsonpプロキシを備えたストアを使用してリストビューにデータを入力します。アプリが起動すると、リクエストが送信され、リストアイテムが適切に応答とともにレンダリングされます。次に、データベースサーバーに新しいアイテムを手動で追加し、以下のコントローラーに表示されるコードでリストを更新し、コンソールでストアオブジェクトを調べると、新しく作成されたアイテムがストアデータにあることがわかります。これまでのところ、すべてが期待どおりです。ただし、新しいアイテムはリストの更新されていません。奇妙なことに、リストオブジェクトとそれに含まれるストアオブジェクトを調べると、新しく作成されたアイテムが含まれていません。ただし、（ストアをリロードしてリストを更新するのではなく）アプリを再起動すると、新しく作成された新しいアイテムがリストに表示されます。私にはどういうわけか私は2つのストアインスタンスを持っているようです、1つは新しいデータ（Ext.getStoreで取得）を使用し、もう1つは（リストビュー内の）データを使用しないで、実際には同じであると考えました。そんなことがあるものか？以下に私がどのように物事を行うかを示します。どんな助けでも大歓迎です。

コントローラー

Ext.define('VB1.controller.ListController', {
    extend: 'Ext.app.Controller',
    config: {
        refs: {
            listView: 'listview',
            refreshButtonTap: '#refreshbutton',
        },
        control: {
            refreshButtonTap: {
                onRefreshList: 'refreshList',
            },
        }    
    },
    launch: function () {
        this.callParent(arguments);
        Ext.getStore('MyStore').addListener('load', 'recordLoaded', this);
    },
    refreshList: function () {
        var loadedStore = Ext.getStore('MyStore').load();
        console.log(loadedStore) //here the new item is included
    },
    recordLoaded: function () {
        var list = this.getListView();
        list.refresh();
        console.log(list) //here the new item is not included in the store object inside   
                                  //listobject
    }
});

店舗

Ext.define('VB1.store.MyStore', {
    extend: 'Ext.data.Store',
    alias: 'widget.mystore',
    config: {
        model: 'VB1.model.MyModel',
        autoLoad: true,
        proxy: {
            type: 'jsonp',
            url : 'myUrl.js',
            enablePagingParams: false,
            reader: {
                type: 'json',
                rootProperty: 'array.resources'
            },
        },
    },
});

リストビュー

Ext.define('VB1.view.ListView', {
    extend: 'Ext.dataview.List',
    alias: 'widget.listview',        
    requires: [
        'Ext.dataview.List',
    ],
    scrollable: 'vertical',
    config: {
        loadingText: "loading...",
        emptyText: '</pre><div class="notes-list-empty-text">No notes found.</div><pre>',
        itemTpl: '</pre><div class="list-item-title">{title}</div><div class="list-item-narrative"><img src="{listlogo}"/></div><pre>',
    },
    listeners: {
        itemtap: function(list, index, item, record) {
            this.fireEvent('showDetails', record, this);
        }
    },
});

これは、アプリの起動時にストアを含むリストをビューポートに追加する方法です

var listView = {
    xtype: 'listview',
    store: {xtype: 'mystore'},
}
Ext.Viewport.add(listView);
4

1 に答える 1

1

問題が何であるかを知りました。まず、私が思ったように、ストアは2回インスタンス化されました。明らかに、あるときはアプリで、別のときはビューで。したがって、私は2つの店舗を持つことになりました。storeIDを設定しなかったため、ストアは、ストアのエイリアス構成で指定したxtype名に基づいて2つの一意のIDで識別されるようになりました。

私が解決して以下のようにコントローラーにログインしたストアのIDはex-mystore-1でした

var loadedStore = Ext.getStore('MyStore').load();
      console.log(loadedStore) //here the new item was included

リストビューオブジェクト内のストアはIDext-mystore-2を取得しました

var list = this.getListView();
    console.log(list._store); //here the new item was not included

穴の問題を私の好意で変えたのは、storeIdをストアに追加したときでした。その後も、同じstoreIds（ただし、一意のIDまたは監視可能なIDが異なる）を持つ2つのストアがありました。良い新機能は、新しいアイテムが両方のストアインスタンスに含まれるようになったことです。また、リストビューでストアのxtypeをインスタンス化せずに、storeIDで参照することにより、2番目のストアインスタンスを取り除くことができました。これで、すべてが正常に機能します。これを見てくれた人に感謝します。これが同様の問題を見つけた人の助けになることを願っています。

于 2012-04-19T11:01:18.730 に答える