ExtJS 6.2 更新时绑定视图模型的问题
ExtJS 6.2 A problem with Binding a view model while updating
我在 ExtJS 6.2 中绑定视图模型时遇到问题。我想在提交表单时自动更新我的模型。这是我的视图模型:
Ext.define('..model.OperationProperty', {
idProperty: 'ObjectID',
binding: {
deep: true
},
fields: [
{
name: 'ID',
type: 'integer'
},
{
name: 'Operation',
type: 'auto'
},
{
name: 'OperationForInvoice',
type: 'auto'
}
]
});
Operation 和 OperationForInvoice 是不同的模型。
我成功加载数据了;
viewmodel.setData({
operationproperty: operationproperty
});
operationproperty.load();
这是我在容器中的复选框。
{
xtype: 'container',
layout: {
type: 'vbox',
pack: 'center',
align: 'middle'
},
items: {
xtype: 'checkbox',
bind: {
data: {
value: '{operationproperty.Operation.IsExplanationNecessary}',
deep: true
}
}
//bind: "{operationproperty.Operation.IsExplanationNecessary}",
//deep: true,
//bind: {
// value: "{showIsExplanationNecessary}"
//}
//bind: {
// Operation: {
// bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
// deep: true
// }
//}
}
和
viewmodel looks good 加载数据后。加载了 Operation 和 OperationForInvoice 模型并且我的复选框看起来已选中。
但是当我在我的表单中做一些事情时,例如取消选中复选框,更改不会出现在视图模型上但操作对象出现在视图模型的底部仅包含更改的项目。
I added the screen shot
我也搜索了 "deep: true" 但它不起作用或者我找不到正确的使用方法。我尝试在视图模型中使用公式我显示相同的结果它给出相同的结果。
formulas: {
showIsExplanationNecessary: {
bind: {
bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
deep: true
},
get: function (get) {
return get;
},
set: function (value, type) {
debugger;
this.set('operationproperty.Operation.IsExplanationNecessary', value); //not set the field and add Operation object again
}
}
}
希望有人帮忙谢谢
我通过更改公式的设置部分解决了这个问题。新公式将像;
showIsExplanationNecessary: {
get: function (get) {
var operation = get('operationproperty.Operation');
if (operation == null || operation.IsExplanationNecessary == null)
return false;
if (operation.IsExplanationNecessary != null) {
return operation.IsExplanationNecessary;
}
return false;
},
set: function (value, type) {
this.getData().operationproperty.getData().Operation.IsExplanationNecessary = value;
}
}
如果存在其他解决方案,请通知我。
谢谢你的时间。
我在 ExtJS 6.2 中绑定视图模型时遇到问题。我想在提交表单时自动更新我的模型。这是我的视图模型:
Ext.define('..model.OperationProperty', {
idProperty: 'ObjectID',
binding: {
deep: true
},
fields: [
{
name: 'ID',
type: 'integer'
},
{
name: 'Operation',
type: 'auto'
},
{
name: 'OperationForInvoice',
type: 'auto'
}
]
});
Operation 和 OperationForInvoice 是不同的模型。
我成功加载数据了;
viewmodel.setData({
operationproperty: operationproperty
});
operationproperty.load();
这是我在容器中的复选框。
{
xtype: 'container',
layout: {
type: 'vbox',
pack: 'center',
align: 'middle'
},
items: {
xtype: 'checkbox',
bind: {
data: {
value: '{operationproperty.Operation.IsExplanationNecessary}',
deep: true
}
}
//bind: "{operationproperty.Operation.IsExplanationNecessary}",
//deep: true,
//bind: {
// value: "{showIsExplanationNecessary}"
//}
//bind: {
// Operation: {
// bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
// deep: true
// }
//}
}
和 viewmodel looks good 加载数据后。加载了 Operation 和 OperationForInvoice 模型并且我的复选框看起来已选中。 但是当我在我的表单中做一些事情时,例如取消选中复选框,更改不会出现在视图模型上但操作对象出现在视图模型的底部仅包含更改的项目。 I added the screen shot
我也搜索了 "deep: true" 但它不起作用或者我找不到正确的使用方法。我尝试在视图模型中使用公式我显示相同的结果它给出相同的结果。
formulas: {
showIsExplanationNecessary: {
bind: {
bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
deep: true
},
get: function (get) {
return get;
},
set: function (value, type) {
debugger;
this.set('operationproperty.Operation.IsExplanationNecessary', value); //not set the field and add Operation object again
}
}
}
希望有人帮忙谢谢
我通过更改公式的设置部分解决了这个问题。新公式将像;
showIsExplanationNecessary: {
get: function (get) {
var operation = get('operationproperty.Operation');
if (operation == null || operation.IsExplanationNecessary == null)
return false;
if (operation.IsExplanationNecessary != null) {
return operation.IsExplanationNecessary;
}
return false;
},
set: function (value, type) {
this.getData().operationproperty.getData().Operation.IsExplanationNecessary = value;
}
}
如果存在其他解决方案,请通知我。 谢谢你的时间。