Javascript extjs数据视图不显示图像

我想使用dataview显示一些图片。我有一个模型和一个带有url的商店。我的问题很简单，我配置了xtype:“dataview”，但不起作用，也没有显示任何错误。我做错了什么

商店：

Ext.define('Proyecto.store.ST_PJdatos', {
    extend: 'Ext.data.Store',
    model: 'Proyecto.model.MD_PJdatos',

data: [
    { idPersonaje: 1, nombre: 'Aerie', retrato: 'http://img.picshare.at/1440990535_female_godlike_moon_jasonseow01_lg.png', arquetipo: 'Neutral', profesion: 'Mago', pv: 16, pa: 9, ps: 12, idAtributos: 1 },
    { idPersonaje: 2, nombre: 'Tybalt', retrato: 'http://img.picshare.at/1440990535_male_human_jasonseow03_lg.png', arquetipo: 'Neutral', profesion: 'Picaro', pv: 21, pa: 18, ps: 19, idAtributos: 2 },
    { idPersonaje: 3, nombre: 'Zojja', retrato: 'http://img.picshare.at/1440990535_N7bmTqw.png', arquetipo: 'Maligno', profesion: 'Clerigo', pv: 26, pa: 14, ps: 29, idAtributos: 3 },
    { idPersonaje: 4, nombre: 'Arcturus', retrato: 'http://img.picshare.at/1440990535_poe_beaverskin02_lg.png', arquetipo: 'Maligno', profesion: 'Caballero', pv: 31, pa: 27, ps: 10, idAtributos: 4 }
]
});

型号：

Ext.define('Proyecto.model.MD_PJdatos', {
extend: 'Ext.data.Model',

fields: [
    { name: 'idPersonaje', type: 'int' },
    { name: 'nombre', type: 'auto' },
    { name: 'retrato', type: 'auto' },
    { name: 'arquetipo', type: 'auto' },
    { name: 'profesion', type: 'auto' },
    { name: 'pv', type: 'int' },
    { name: 'pa', type: 'int' },
    { name: 'ps', type: 'int' },
    { name: 'idAtributos', reference: 'Proyecto.model.MD_PJatributos', unique: true } 


]
});

主视图：

Ext.define('Proyecto.view.main.Main', {
    extend: 'Ext.container.Container',
    requires: [
        'Proyecto.view.main.MainController',
        'Proyecto.view.main.MainModel'
    ],

    xtype: 'app-main',

    controller: 'main',
    viewModel: {
        type: 'main'
    },

    layout: {
        type: 'border'
    },

    items: [{
        xtype: 'panel',
        bind: {
            title: '{name}'
        },
        region: 'west',
        width: 250,
        split: true,
        items: [{
            xtype: 'dataview',
            store:  Ext.data.StoreManager.lookup('Proyecto.model.MD_PJdatos'),
            tpl: [
                '<tpl for=".">',
                    '<div class="thumb-wrap">',
                        '<div class="thumb"><img src="{retrato}"></div>',
                        '<span class="x-editable">{nombre}</span>',
                    '</div>',
                '</tpl>'
            ],
            itemSelector: 'div.thumb-wrap'
         }],
    },{
        region: 'center',
        xtype: 'tabpanel',
        items:[{
            title: 'Tab 1',
            html: '<h2>Content appropriate for the current navigation.</h2>'
        }]
    }]
});

Ext.define（'Proyecto.view.main.main'{
扩展：“Ext.container.container”，
要求：[
'Proyecto.view.main.MainController'，
'Proyecto.view.main.main模型'
],
xtype:'应用程序主'，
控制器：'主'，
视图模型：{
类型：'main'
},
布局：{
类型：“边框”
},
项目：[{
xtype:'面板'，
绑定：{
标题：“{name}”
},
地区：'西部'，
宽度：250，
斯普利特：是的，
项目：[{
xtype:“数据视图”，
store:Ext.data.StoreManager.lookup（'Proyecto.model.MD_PJdatos'），
第三方物流：[
'',
'',
'',
“{nombre}”，
'',
''
],
项目选择器：“div.thumb-wrap”
}],
},{
地区：'中心'，
xtype:'tabpanel'，
项目：[{
标题：“表1”，
html:“适合当前导航的内容。”
}]
}]
});

---

首先，您要将模型类名传递给您的

StoreManager。lookup

调用，而不是store类名：

store:  Ext.data.StoreManager.lookup('Proyecto.model.MD_PJdatos')

然后，即使您传递了存储类名，它仍然不起作用，因为需要“存储的id、存储实例或存储配置”，而不是存储类名

将您的

StoreManager.lookup

调用替换为：

new Proyecto.store.ST_PJdatos

---

对不起，这是个很糟糕的主意。只需给存储一个storeId，在控制器中要求它（使用requires数组或stores数组），然后将storeId设置为dataview的store值。这不会在每次创建dataview时都实例化一个新的存储，并且会保留对它的引用。@Tarabass问题是什么错了，而不是如何做对：）我指出了错的地方，然后简单地展示了让它工作的最快方法-尽管没有必要。这不是一个争议，而是对你答案的补充。我不想在最佳实践之上引入坏习惯；）