什么是 SAP UI5 XML 视图里的 customData

简介: 什么是 SAP UI5 XML 视图里的 customData

下面是 XML 视图里的代码:

<core:FragmentDefinition xmlns:core="sap.ui.core"
       xmlns="sap.m">
       <Column>
              <Text text="{i18n|sap.suite.ui.generic.template.ListReport|STTA_C_MP_Product>xfld.Rating}" />
              <customData>
                     <core:CustomData key="p13nData"
                            value='\{"columnKey": "Rating", "leadingProperty":"Price", "columnIndex" : "100"}' />
              </customData>
       </Column>
       <Column>
              <Text text="{i18n|sap.suite.ui.generic.template.ListReport|STTA_C_MP_Product>xfld.BreakoutColumn}" />
              <customData>
                     <core:CustomData key="p13nData"
                            value='\{"columnKey": "Test", "columnIndex" : "101"}' />
              </customData>
       </Column>
</core:FragmentDefinition>


SAP UI5 中,customData 是一个非常有用的功能,它允许我们在特定的 UI 控件上附加额外的数据。这些数据可以是任何我们需要的数据,例如一些特定的配置,或者一些用于后续处理的关键信息。然而,值得注意的是,这些 customData 并不会直接影响 UI 控件的表现或者行为。

customData 是一个 aggregation(聚合),它包含的是一系列的 sap.ui.core.CustomData 对象。每一个 CustomData 对象都有两个关键属性:keyvaluekey 是唯一的,用于标识这个数据,而 value 则是存储的实际数据。


在 XML 视图中,我们可以这样使用 customData

<Button text="Click me" press="onButtonPress">
  <customData>
    <core:CustomData key="myKey" value="myValue" />
  </customData>
</Button>


在这个例子中,我们在一个按钮上添加了一个 customData。这个 customDatakeymyKeyvaluemyValue。然后在按钮的 press 事件处理函数中,我们可以这样获取这个数据:

onButtonPress: function(oEvent) {
  var oButton = oEvent.getSource();
  var oCustomData = oButton.data("myKey");
  console.log(oCustomData); // 输出 "myValue"
}


在这个函数中,我们首先获取了触发事件的源控件,也就是按钮自己。然后使用 data 方法并传入我们的 key,就可以获取到对应的 value 了。


customData 的一个常见的用途是用于保存一些在运行时会发生变化的数据。例如,在一个列表中,每个列表项可能需要关联一些特定的数据,这些数据在列表生成时是未知的。这个时候,就可以在生成列表项时,将这些数据作为 customData 附加到列表项上。然后在后续的处理中,比如点击列表项时,就可以从列表项上获取这些数据了。

需要注意的是,虽然 customData 非常方便,但也不应该滥用。首先,customData 保存的数据是在客户端的,所以不应该用来保存敏感数据。其次,customData 保存的数据并不会被自动同步到服务端,所以如果需要将数据保存到服务端,还需要自己手动处理。最后,customData 并不能替代 model,它只是一个临时存储数据的地方,如果需要长期存储或者多个控件共享数据,还是应该使用 model。

相关文章
|
1月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
27 0
|
1月前
|
JavaScript 前端开发 开发者
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
15 0
|
1月前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
15 0
|
1月前
|
XML 存储 数据格式
SAP UI5 控件 customData 属性的应用介绍
SAP UI5 控件 customData 属性的应用介绍
33 0
|
1月前
|
前端开发 JavaScript API
SAP UI5 sap.ui.require.toUrl 的作用介绍
SAP UI5 sap.ui.require.toUrl 的作用介绍
31 0
|
1月前
|
搜索推荐
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
18 0
|
1月前
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
20 0
|
2月前
|
Web App开发 前端开发 JavaScript
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
48 0
|
2月前
|
Web App开发 JSON JavaScript
SAP UI5 应用程序小技巧 - 一键将 JSON 对象导出成本地 json 文件
SAP UI5 应用程序小技巧 - 一键将 JSON 对象导出成本地 json 文件
25 0
|
1月前
|
开发者 UED
SAP UI5 SmartFilterBar 中 ControlConfiguration Aggregation 的作用介绍
SAP UI5 SmartFilterBar 中 ControlConfiguration Aggregation 的作用介绍
14 0

热门文章

最新文章

相关课程

更多