我想根据记录是否为幻影来隐藏一个复选框。试图使用视图模型实现这一点,但似乎不起作用。请参阅下面的相关代码。为了简洁起见,我省略了不相关的代码。viewModel与视图的绑定正在按预期工作。当我尝试将activeRecord.name
绑定到title属性时,双向数据绑定工作正常。
视图模型
Ext.define('MyApp.view.content.ContentViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.content',
data: {
activeRecord: null
}
});
控制器
var contentWindow = Ext.widget('content-details');
contentWindow.getViewModel().set('activeRecord', contentBlock);
查看
viewmodel: 'content',
items: [
{
xtype: 'checkbox',
boxLabel: 'My checkbox',
bind: {
hidden: '{!activeRecord.phantom}'
}
}
]
我们最终为Model使用了以下基类,这比ViewModel中的公式更方便。
// Use your own name instead of BaseModel
Ext.define('BaseModel', {
extend: 'Ext.data.Model',
fields: [{
name: 'phantom',
persist: false,
convert: function (v, rec) {
var id = rec.data[rec.idProperty];
return !id || (Ext.isString(id) && id.indexOf(rec.entityName) == 0);
}
}],
commit: function (silent, modifiedFieldNames) {
this.data.phantom = false;
this.callParent(arguments);
}
});
然后你就可以使用你想要的绑定了
bind: {
hidden: '{!activeRecord.phantom}'
}
尝试使用公式:
data: {
rec: null,
callback: null
},
formulas: {
isNew: function (get) {
return !get('rec') || get('rec').phantom;
}
}
那么在你看来:
bind: {
disabled: '{!isNew}'
},