在XTemplate中渲染自定义组件

时间:2012-09-26 08:44:08

标签: extjs extjs4 extjs4.1 extjs-mvc

Ext.define('GB.view.DigestList',{
    extend: 'Ext.panel.Panel',
    alias:'widget.digestlist',

            items:[ {
                xtype:'dataview',
                store: 'GB.store.Digests',
                tpl: new Ext.XTemplate(
                          '<tpl for=".">',
                            '<div class="container">',
                              '{name}',
                              '<div class="davidfun"></div>',
                            '</div>',
                          '</tpl>'
                ),      
                listeners: {
                    viewready: function(){
                        var home_d = Ext.create('GB.view.MyOwnDigest');
                        home_d.render(Ext.query('.davidfun')[0]);
                        // home_d.render(Ext.getBody()); <- it'll work fine with this line
                    },
                }
              }],

    bind: function(record, store) {
        this.getComponent(0).bindStore(record);
    }

});


Ext.define('GB.store.Digests', {
    extend:'Ext.data.Store',
    model: 'GB.model.Digest',
    data:[
        {'name':'name111'},
        {'name':'name222'}
    ]
});

有人知道为什么我不能通过Ext.query('。davidfun')[0]获得Xtemplate中的“davidfun”div类,

它将始终显示'undefined',感谢您的回复:)

代码更新:

  
    

问题解决了!

  

1 个答案:

答案 0 :(得分:4)

您可以尝试数据视图的“viewready”事件。

请参阅我的示例http://jsfiddle.net/2huvt/