Extjs4 MVC Xtemplate错误：无法设置null的属性'innerHTML'

Question

我是extjs的新手。 我想在面板中显示一些信息。 我创建了一个面板，当我用数据覆盖tpl时，会发生“Uncaught TypeError：无法设置属性'innerHTML'为null”。

代码：

initComponent: function(){
        var me = this;
        var data={
                name:'lux',
                age:'22'
            };
        var item=Ext.create('Ext.panel.Panel',{title:'title'});
        var tpl=new Ext.XTemplate(
            '<p>Name: {name}</p>',
            '<p>Company: {age}</p>',
            '<p>Location:</p>',
            '<p>Kids: '
            );
        tpl.overwrite(item.body, data);

        Ext.applyIf(me,{
            items:item

        });
        me.callParent( arguments );
    } 

Answer 1

问题是组件尚未呈现，这意味着body元素不存在。相反，你应该使用api：

initComponent: function() {
    var item = new Ext.panel.Panel({
        title: 'title',
        tpl: [
            '<p>Name: {name}</p>', 
            '<p>Company: {age}</p>', 
            '<p>Location:</p>'
        ],
        data: {
            name: 'lux',
            age: '22'
        }
    });

    this.items = item;
    this.callParent(arguments);
}