Extjs 森查触摸2。空列表

存储对象是通过ajax请求动态加载的。在控制台中调试时，我可以看到存储对象被记录填充，但列表为空

代码：

视口视图

Ext.define('sample.views.Viewport', {
    extend: 'Ext.tab.Panel',

    title:   'Hello world!',

    xtype: 'viewport',

    config: {
        fullscreen: true,

        tabBar: {
            docked: 'bottom',
        },

        items: [
            { xclass: 'sample.views.wares.lists.Popular' },
        ]
    }
});

导航视图

Ext.define('sample.view.wares.lists.Popular', {
    extend: 'Ext.NavigationView',

    xtype: 'Popular',

    config: {       
        iconCls: 'home',
        title: 'Pop. prekės',

        items: [
            {
                xtype: 'wares',                                                         
            }
        ]   
    }
});

列表视图

Ext.define('sample.views.wares.lists.List', {
    extend: 'Ext.List',

    xtype: 'wares',

    config: {
        store: 'Wares', 
        itemTpl: '{Name}'
    },

    initialize: function () {
        this.config.title = sample.app.title;
    }
});    

存储通过Ajax请求动态加载的记录对象

Ext.define('sample.store.Wares', {
    extend: 'Ext.data.Store',

    config: {
        model: "sample.models.WaresListItem"
    }
});

---

大多数情况下，当您看不到内部组件时，这是因为您尚未定义其容器的布局

尝试向导航视图的配置中添加布局，如下所示：

config: {       
    iconCls: 'home',
    title: 'Pop. prekės',
    layout: 'fit',
    items: [
        {
            xtype: 'wares',                                                         
        }
    ]   
}

希望这有帮助

---

另请参见：RDougan在此处的回答：

大多数情况下，当您没有看到内部组件时，这是因为您没有定义其容器的布局

尝试向导航视图的配置中添加布局，如下所示：

config: {       
    iconCls: 'home',
    title: 'Pop. prekės',
    layout: 'fit',
    items: [
        {
            xtype: 'wares',                                                         
        }
    ]   
}

希望这有帮助

---

另请参见：RDougan在此处的回答：

多次查看了官方文档中的示例应用程序，并通过调用

initialize

函数中的

callParent

函数解决了问题。我还不知道为什么

initialize: function () {
    this.config.title = sample.app.title;
    this.callParent();
}

---

多次查看官方文档中的示例应用程序，通过调用

initialize

函数中的

callParent

函数解决了问题。我还不知道为什么

initialize: function () {
    this.config.title = sample.app.title;
    this.callParent();
}

如果您有initialize函数，则“this.callParent（）”很重要，因为它调用parent（'Ext.dataview.List'），并要求它执行某些默认操作，而这些操作是列表构造所必需的。这类似于在java中从构造函数调用super

如果您可以将其移动到声明块

this.config.title = sample.app.title;

像这样做

config: {
    store: 'Wares', 
    itemTpl: '{Name}',
    title: sample.app.title
},

您不需要完全初始化块

如果您有initialize函数，则“this.callParent（）”很重要，因为它调用parent（'Ext.dataview.List'），并要求它执行某些默认操作，而这些操作是列表构造所必需的。这类似于在java中从构造函数调用super

如果您可以将其移动到声明块

this.config.title = sample.app.title;

像这样做

config: {
    store: 'Wares', 
    itemTpl: '{Name}',
    title: sample.app.title
},

---

您不需要完全初始化块

仍然需要相同的结果。布局配置不影响显示列表。结果仍然相同。布局配置不影响显示列表。