2013-09-26 20 views
0

我尝试定义从http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.view.View数据视图,以http://jsfiddle.net/JtTDH/Extjs4.1 - 定义数据视图失败

这里是我的代码

Ext.define('Example', { 
    extend: 'Ext.view.View',  
    tpl: new Ext.XTemplate(
    '<tpl for=".">', 
     '<div style="margin-bottom: 10px;" class="thumb-wrap">', 
      '<img src="{src}" />', 
      '<br/><span>{caption}</span>', 
     '</div>', 
    '</tpl>' 
    ), 
    itemSelector: 'div.thumb-wrap', 
    emptyText: 'No images available', 
    initComponent: function() { 
     var store = Ext.create('Ext.data.Store', { 
      id:'imagesStore', 
      fields: [ 
       { name:'src', type:'string' }, 
       { name:'caption', type:'string' } 
      ], 
      data: [ 
       { src:'http://www.sencha.com/img/20110215-feat-drawing.png', caption:'Drawing & Charts' }, 
       { src:'http://www.sencha.com/img/20110215-feat-data.png', caption:'Advanced Data' }, 
       { src:'http://www.sencha.com/img/20110215-feat-html5.png', caption:'Overhauled Theme' }, 
       { src:'http://www.sencha.com/img/20110215-feat-perf.png', caption:'Performance Tuned' } 
      ] 
     }); 

     this.store = store; 
     this.callParent(arguments); 
    } 
}); 

我认为这是正确的,但无法运作。如何解决这个谢谢。

回答

1

你的代码很好,但你需要为它定义一个渲染目标。例如,您可以将renderTo: Ext.getBody()添加到您的定义中,并且它将正常工作。在这里看到一个工作示例:https://fiddle.sencha.com/#fiddle/md