我通过以下方式从控制器传递记录:
showDetail: function (list, record) {
this.getMain().push({
xtype: 'leaddetail',
data: record.data
});
},
我的观点:
Ext.define('ApexChat.view.LeadDetail', {
extend: 'Ext.Panel',
xtype: 'leaddetail',
init: function() {
debugger;
},
config: {
styleHtmlContent: true,
scrollable: 'vertical',
title: 'Details',
frame: true,
labelwidth: 75,
items: [
{
xtype: 'fieldset',
columnWidth: 0.5,
collapsible: true,
title: 'Lead Information',
defaultType: 'textfield',
defaults: { anchor: '100%' },
layout: 'vbox',
items: [
{
fieldLabel: 'Name',
name: 'name',
tpl: '{name}',
value: '{name}',
disabled: true
},
{
fieldLabel: 'Email',
name: 'email',
value: '{email}',
disabled: true
},
{
fieldLabel: 'Phone',
name: 'phone',
value: '{phone}',
disabled: true
}
]
},
{
xtype: 'fieldset',
columnWidth: 0.5,
collapsible: true,
title: 'Exta Information',
defaultType: 'textfield',
defaults: { anchor: '100%' },
layout: 'vbox',
items: [
{
fieldLabel: 'Company Key',
name: 'companykey',
value: '{companyKey}',
disabled: true
},
{
fieldLabel: 'Chat ID',
name: 'chatid',
value: '{chatId}',
disabled: true
},
{
fieldtype: 'textarea',
fieldLabel: 'Notes',
name: 'notes',
value: '{notes}',
disabled: true
}
]
}
]
}
});
但在文本区域内我仍然看到{companyName}
假设它不能这样做,那么如何访问从控制器传递的记录,以便我可以执行.get('name')或类似的东西?
答案 0 :(得分:1)
tpl
和data
用于呈现自定义HTML,而Ext字段是处理自己呈现的组件。除高级用例外,您不必触摸他们的tpl
。
与主要基于HTML模板的其他框架相反,Ext本质上是一个面向对象的组件库。你很少自己去HTML级别。
要一次设置一堆字段的值,您需要将它们放在Ext.form.Panel
中。然后,您可以setValues
使用setRecord
,或者在您的情况下使用record
。
使用您的示例,您将以这种方式配置字段:
Ext.define('ApexChat.view.LeadDetail', {
extend: 'Ext.Panel',
xtype: 'leaddetail',
config: {
...
items: [{
fieldLabel: 'Name',
// you only need the name for the field to load data
name: 'name'
},{
fieldLabel: 'Email',
name: 'email'
}]
}
});
然后,您可以使用{{3}}配置选项在创建时分配记录:
this.getMain().push({
xtype: 'leaddetail',
// using record config option
record: record
});
或者您可以使用这些方法加载数据:
// get a ref to your component the way you want, this line just illustrates what's in formPanel
var formPanel = Ext.create({xtype: 'leaddetail'});
// using setValues
formPanel.setValues(record.data);
// or using setRecord
formPanel.setRecord(record);