没有 XTemplate 的 Ext.Panel 中的数据？

Question

有没有一种方法可以在不使用 XTemplate 的情况下将数据应用于“常规”字段和子项？

我的代码如下所示：

var panel = new Ext.Panel({
   data: myDataBlock
   defaults: {
      data: myDataBlock
   }
   title: 'Name: {name}'
   items: [{
       xtype: 'panel',
       title: 'more: {moreData}'
   }]
});

使用数据形式“myDataBlock”进行适当的替换需要什么？

干杯

Answer 1

“常规”字段是什么意思？

Panel 的 data 属性是您想要呈现的初始数据，它是使用模板呈现的。如果您愿意，您可以指定用于渲染的自定义模板，但无论哪种方式，它都必须使用模板，以便 ExtJS 知道如何渲染您的内容。

查看Component的源码：

if (this.data) {
    this.tpl[this.tplWriteMode](contentTarget, this.data);
    delete this.data;
}

数据：应用于 tpl 以更新的初始数据集
组件的内容区域。

Answer 2

如果我理解正确，您希望通过数据块动态创建面板来设置 title 等属性...

如果是这样，我的建议是编写自己的扩展 Ext 的面板类.Panel 并在其组件启动之前执行这些操作。

示例：

//Define your own panel class
MyPanel = Ext.extend(Ext.Panel, {
  width: 300,
  height: 150,
  initComponent: function(){
     if(this.data){
        Ext.apply(this,{
           title: 'Name: '+ this.data.title,
           items: [
              {
                 xtype: 'panel',
                 html: 'more: '+ this.data.moreData
              }
           ]
        });
     }
     MyPanel.superclass.initComponent.call(this);
  }
});

//Use the customized panel
var p = new MyPanel({
   data: {title:'my title', moreData: 'other data'},
   renderTo: Ext.getBody()
});

顺便说一下，Template 仅用于以简单的方式呈现面板的内容。在您的情况下，使用模板是不正确的，因为它与配置属性或面板的项目无关。