Sencha touch 在sencha touch 2中动态加载列表

我有一个Sencha Touch 2.0应用程序，它设置了卡片布局。它包含一个带有用户可以单击的图标的仪表板和一个客户列表（xtype:'list'）。加载应用程序时，我加载应用程序中的所有“卡”，包括客户列表，但除非设置了localStorage变量，否则我不会加载数据（通过代理）。加载所有内容后，我通过检查localStorage变量来检查用户是否应该自动登录。如果他们自动登录，那么我的应用程序就可以完美运行。如果他们不是，我给他们看“登录”卡，这基本上是一个登录表单。一旦他们以表单形式提交此日志，我将执行一个ajax调用。如果返回结果正确，我会将它们发送到“仪表板”卡。但在此之前，我尝试通过ajax调用加载客户列表，使用：

var tmpId = { id: example.id };

var cListStore = Ext.create('example.store.CustomerList');
cListStore.getProxy().setExtraParams(tmpid);
cListStore.load();

通过上面的代码，我可以看到我的代理调用正在发生，并且我可以看到响应是正确的。但是，当我看到仪表板并单击客户图标时，我会看到一个空列表。我的工具栏在那里，甚至我列表上的indexBar也在那里，只是没有数据。我不确定我做错了什么。我在下面列出了我的列表视图、商店和模型，希望这将有助于任何关注这一点的人：

Ext.define('example.view.CustomerList', {
    extend: 'Ext.Container',
    id: 'customerListContainer',
    xtype: 'customerlist',
    config: {
        layout: 'fit',
        items: [{
            xtype: 'toolbar',
            docked: 'top',
            title: 'Customers',
            items: [{
                xtype: 'button',
                text: 'Home',
                id: 'customerListHomeButton',
                ui: 'back'
            }]
        }, {
            xtype: 'list',
            itemTpl: '<div class="contact">{first_name} <strong>{last_name}</strong>  </div>',
            store: 'CustomerList',
            id: 'customer_list',
            grouped: true,
            indexBar: true
        }]
    }
});

Ext.define('example.store.CustomerList', {
    extend: 'Ext.data.Store',
    id: 'customerListStore',
    requires: ['example.model.CustomerList'],
    config: {
        model: 'example.model.CustomerList',
        sorters: 'last_name',
        /*
         * This actually makes the ajax request
         */
        proxy: {
            type: 'ajax',
            url: '/example/api/customerList.php',
            extraParams: {
                id: example.id
            },
            reader: {
                type: 'json'
            }
        },
        autoLoad: ((example.id > 0) ? true : false), //only fetch the data if we have a id, or else we'll get an error from our api

        /*
         * Set the group headers to the first letter of the last name
         */
        grouper: {
            groupFn: function (record) {
                return record.get('last_name')[0];
            }
        }
    }
});

Ext.define('example.model.CustomerList', {
    extend: 'Ext.data.Model',
    config: {
        /*
         * Define the fields we get back from our ajax request
         */
        fields: [
            'first_name',
            'last_name',
            'address1',
            'address2',
            'city',
            'state',
            'zip_code',
            'phone_daytime',
            'phone_evening',
            'phone_cell',
            'email']
    }
});

---

这产生了同样的结果。我可以看到代理正在正确获取数据，但它仍在我的列表组件中呈现。

我不是Sencha Touch 2专家，但我看到您将列表存储设置为

store: 'CustomerList'

---

我想知道什么是

CustomerList

。您是否应该将列表的存储设置为

customerListStore

，这是您的存储id？

我想出来了，我删除了以下几行：

var cListStore = Ext.create('example.store.CustomerList');
cListStore.getProxy().setExtraParams(tmpid);
cListStore.load();

我在其位置添加了以下内容：

Ext.getStore('CustomerList').getProxy().setExtraParams(tmpid);
Ext.getStore('CustomerList').load();

---

基本上我不需要创建我的商店的新实例，一个已经创建了，所以我只需要一种方法来识别它（Ext.getStore），然后加载它。感谢所有查看它的人。

实际上我没有storeId，id在我的store类中。文档中说在“store:”之后传递一个“store instance”，我认为这不是问题所在，因为如果用户自动登录，那么客户列表就可以正常工作。谢谢你。

Ext.getStore('CustomerList').getProxy().setExtraParams(tmpid);
Ext.getStore('CustomerList').load();