- SAP UI5 setProperty 的执行逻辑单步调式和分析
- SAP UI5 控件的 setXXX,最后都会调用到托管对象的
- SAP UI5 FileUploader 的本地文件上传技术实现
- 关于 SAP UI5 参数 $$updateGroupId 前面
- SAP UI5 应用开发教程之五十三 - 如何自定义 SAP U
- 通过 FileUploader 的初始化,了解 SAP UI5
- 用 React 结合 SAP UI5 Web Component
- SAP UI5 设备类型检测 Device API 的工作原理
- SAP UI5 的 TimePicker ,一个钟表外观的时间选
- SAP ABAP OData 服务的分页加载数据集的实现(Pag
按照 Jerry 这篇文章介绍的代码,运行之后,给类型为 sap.ui.model.type.Currency
的字段设置一个非 number
类型的值之后,触发该数据类型自带的数据校验机制,显示 Enter a number
的错误消息。
SAP UI5 应用开发教程之四十六 - 使用 Message Manager 实现开箱即用的验证(Validation)信息抛出
本文介绍 SAP UI5 ManagedObject
的 setProperty
方法的执行原理。
首先明确,什么是 ManagedObject
?
托管属性表示 ManagedObject 的状态。 它们可以存储简单数据类型(如“字符串”或“整数”)的单个值。 它们具有名称(例如“size”)和获取当前值(getSize)或设置新值(setSize)的方法。 当通过调用 setter 修改属性时,ManagedObject 被标记为无效。 可以使用 #bindProperty 方法将托管属性绑定到 sap.ui.model.Model 中的属性。 对模型属性的更新将自动反映在托管属性中,并且 - 如果 TwoWay 数据绑定处于活动状态,则对托管属性的更改将反映在模型中。 可以通过调用#unbindProperty 删除现有绑定。
![](https://img.haomeiwen.com/i2085791/96d64dda7be36404.png)
当 input 控件失去 focus 之后,触发 onsapfocusleave
,这个方法调用 onChange
:
![](https://img.haomeiwen.com/i2085791/6e405086070b5061.png)
传入的输入参数,event
类型为 sapfocusleave
:
![](https://img.haomeiwen.com/i2085791/ad03324e26702de7.png)
如果当前最新的值和之前的值 getLastValue()
不相等,则调用 this.setValue
:
![](https://img.haomeiwen.com/i2085791/865c4692de3d8187.png)
Input.setValue 调用 InputBase.setValue:
![](https://img.haomeiwen.com/i2085791/938548b15a705959.png)
setValue 最终调用 setProperty,属性名称为 value
:
![](https://img.haomeiwen.com/i2085791/df9e89c1d14a0e7b.png)
正式进入 setProperty 方法,首先从 mProperties
里得到修改之前的值:
![](https://img.haomeiwen.com/i2085791/ff53e8ef31784cbd.png)
然后进行 validateProperty
:
![](https://img.haomeiwen.com/i2085791/de18e086db9cc013.png)
validateProperty 内部,首先从 this.getMetadata().getManagedProperty(sPropertyName)
读取该 value 属性的 元数据
:
![](https://img.haomeiwen.com/i2085791/9e2f3c968ade1809.png)
关于 SAP UI5 控件的元数据设计,请参考我这篇文章:
深入学习SAP UI5框架代码系列之四:SAP UI5控件的元数据实现。
获得 string 类型对象:
![](https://img.haomeiwen.com/i2085791/a41dd41f6c9d0ff0.png)
类型对象由一系列函数组成:
![](https://img.haomeiwen.com/i2085791/7ba0b847bcae7fab.png)
执行 normalize 操作:
![](https://img.haomeiwen.com/i2085791/42aee7de20a1e90c.png)
将这个不合法的 value,设置到 this.mProperties[sPropertyName]
中。
![](https://img.haomeiwen.com/i2085791/8cd65c4e528deb10.png)
进行双向绑定的逻辑处理:this.updateModelProperty
![](https://img.haomeiwen.com/i2085791/cc7d20ff9ac86296.png)
拿到绑定对象:
![](https://img.haomeiwen.com/i2085791/c986de044796d0da.png)
进入双向绑定的处理分支:
![](https://img.haomeiwen.com/i2085791/dfd9b70f486cc026.png)
if (oBinding && oBinding.getBindingMode() == BindingMode.TwoWay) {
oBindingInfo.skipPropertyUpdate++;
SyncPromise.resolve(oValue).then(function(oValue) {
return oBinding.setExternalValue(oValue);
}).then(function() {
oBindingInfo.skipPropertyUpdate--;
return oBinding.getExternalValue();
}).then(function(oExternalValue) {
if (oValue != oExternalValue) {
that.updateProperty(sName);
}
handleSuccess();
}).catch(function(oException) {
oBindingInfo.skipPropertyUpdate--;
handleException(oException);
}).unwrap();
![](https://img.haomeiwen.com/i2085791/fd3d650dea8fc72b.png)
SyncPromise.resolve(oValue).then(function(oValue) {
return oBinding.setExternalValue(oValue);
})
![](https://img.haomeiwen.com/i2085791/39e64bf29d66b889.png)
在 CompositeBinding.js
内部,核心逻辑是第 325 行的代码:
that.oType.parseValue(oValue, that.sInternalType, aCurrentValues);
![](https://img.haomeiwen.com/i2085791/43f9f96e528a4d9f.png)
调用 outputFormat
进行输入值的解析工作:
![](https://img.haomeiwen.com/i2085791/6f08fc432acb4cab.png)
网友评论