日期:2014-05-16  浏览次数:20347 次

extjs4中使用tpl从view中加载store数据出错
JScript code

Ext.define('ZHPT.view.infoPoint.List', {
    extend: 'Ext.Panel',
    alias: 'widget.infoPointList',

    title: '警用',
    //    columns: [
    //        {header: 'Id',  dataIndex: 'id',  flex: 1},
    //        {header: 'PicUrl', dataIndex: 'picUrl', flex: 1}
    //    ]
    items: Ext.create('Ext.view.View', {
        store: 'InfoPoints',
        tpl: [
            '<tpl for=".">',
                '<div class="thumb-wrap" id="{id}">',
                    '<div class="thumb"><img src="{picUrl}" /></div>',
                '</div>',
            '</tpl>',
            '<div class="x-clear"></div>'
             ],
        itemSelector: '.thumb-wrap'
    })
}); 


贴上源代码,我用的extjs4的mvc框架,其他代码不便贴出,太多了。
我几乎是照着examples中dataview的例子写的。
这是一个视图,我之前将这个视图中items换成gridView时没问题,数据都能加载,问题确定不是出在store上,这个store在controller中已经定义过了。
代码运行后没有报出任何exception,但就是这个template模板没有作用,就是并没有循环几个有数据的div出来,一个div都没render出来。
我估计问题就出在这个代码里,我刚上手几天,找了半天找不出问题啊~ 多谢!

------解决方案--------------------
我试了你的代码,用的Ext.create, 正常显示。

------解决方案--------------------
我觉得问题可能出现在Ext4的加载机制中,原因应该是xtype是还没实例化的过程,要等你的组件实例化后xtype才实例化,Ext.create是直接实例化,例子里面是面板是通过Ext。create出来的,所以放在里面的item也可以一起create出来,你的例子是自己定义组件,这个组件只是个类,没有实例化。

如果你一定要这么写的话,可以试试重写他的initComponent方法看看,我一直都是这么写的

JScript code

Ext.define('ACHUI.ux.CommonGrid',{
    alias:'widget.CommonGrid',
    extend:'Ext.grid.Panel',
    initComponent:function(){
        var bbar = Ext.create('Ext.pagetoolbar'{
            store:this.store,
            pageSize : ACHUI_PAGE_LIMIT,
            displayInfo:true
        })
        Ext.apply(this.bbar,bbar);
        Ext.applyIf(this, {
            bbar : bbar
        });
        this.callParent(arguments);
    }
});