共计 2618 个字符,预计需要花费 7 分钟才能阅读完成。
加载 SAPUI5 运行时后开始初始化过程。
SAPUI5 运行时的初始化包含以下步骤:
(1) jQuery 插件次要位于 jQuery.sap 命名空间中,提供 SAPUI5 的基本功能,例如模块化概念、日志框架、性能测量等。
如下图所示:
(2) 定义了全局对象 sap:
(3) sap.ui.core.Core 类与其所有依赖项一起执行。
(4) 运行时配置 (runtime configuration) 由不同起源确定。
(5) 加载配置中申明的所有库和模块及其依赖项, 例如上面这段代码里的 lib:
<script id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.m, sap.ui.comp"
data-sap-ui-bindingSyntax="complex"
data-sap-ui-compatVersion="edge"
data-sap-ui-preload="async"
data-sap-ui-resourceroots='{"sap.ui.demo.tabledelete":"./"}'>
</script>
(6) 对于每个加载的库,都会加载配置主题的 CSS 文件。
例如:https://sapui5.hana.ondemand….
当所有库都加载结束并且文档准备就绪时,内核的 initEvent 被触发并执行所有注册的处理程序。
Initialization Readiness
执行或启动应用程序的最佳工夫点是在框架初始化之后。有三种办法能够让本人适应这个工夫框架。以下列表详细描述了这些初始化筹备挂钩,并提供了何时应用它们的示例。依据您的用例,您可能更喜爱一种形式而不是另一种形式。
ComponentSupport module
在框架初始化后执行代码的最简单办法是应用 sap.ui.core.ComponentSupport.
此选项实用于您心愿应用 sap.ui.core.UIComponent 作为应用程序入口点的场景。
ComponentSupport 容许您在 HTML 文件中申明性地定义一个或多个 sap.ui.core.UIComponent 实例,并负责为您创立必要的 sap.ui.core.ComponentContainer。
无关具体的使用指南,请参阅 ComponentSupport 文档。
Standalone data-sap-ui-oninit module
除了应用 sap.ui.core.ComponentSupport,您还能够在 SAPUI5 疏导脚本元素上定义一个名为 data-sap-ui-oninit 的数据属性。
此属性应援用无效的 SAPUI5 模块,如上面的代码段所示。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-async="true"
data-sap-ui-resourceroots='{"sap.ui5.walkthrough":"./"}'
data-sap-ui-oninit="module:sap/ui5/walkthrough/index">
</script>
</head>
<body>
<div>Hello World</div>
</body>
</html>
SAPUI5 外围将确保在框架初始化过程后在正确的工夫点加载和执行 data-sap-ui-oninit 模块。在此模块中,您能够执行其余利用程序代码,例如创立一个新的 XML 视图实例。
此外,因为不须要额定的内联 script 标记,因而专用的 oninit 模块能够依据您的要求实现更好的 CSP(
Content Security Policy) 合规性。
这种形式在 Jerry 的文章 SAP UI5 初学者教程之二:SAP UI5 的疏导过程 Bootstrap 里有具体论述。
attachInit function
attachInit 函数的回调在框架初始化后间接执行。这段代码能够写在你的主 HTML 文件中的一个独自的内联 script 标签中:
sap.ui.getCore().attachInit(function(){// 应用程序本人的启动逻辑能够写在这里});
Loading of Additional Resources During Bootstrap
SAPUI5 运行时在疏导期间为管制库加载和解释附加资源。
文件按以下程序加载:
(1) Library bootstrap file /<context-path>/resources/<library-name>/library.js
library.js 是一个 JavaScript 文件,其中蕴含库提供的所有枚举类型的 JavaScript 代码以及独立于库中控件的特定于库的初始化代码。该文件调用 sap.ui.getCore().InitLibrary 办法,其中蕴含一个形容库内容的对象(蕴含的控件列表、元素等)。对于应用 SAPUI5 应用程序开发工具或 SAPUI5 离线构建工具开发的库,此文件在构建过程中主动生成。
(2) Library style sheet file /<context-path>/resources/<library-name>/themes/<theme-name>/library.css
蕴含与此库相干的所有款式的规范 CSS 文件。对于应用程序开发工具,此文件在构建期间主动生成。
Dynamic Loading of Libraries
SAPUI5 提供了 sap.ui.getCore().loadLibary() 办法,除了运行时配置中申明的库外,还提供了运行时加载库。
加载后,您能够应用库中的所有控件。对于这些额定的库,同样的限度实用于申明的库:只有在 HTML 页面的 document.ready 事件之后能力拜访文档对象模型 (DOM)。此外,渲染实用于这些库的形式与申明的库雷同。
更多 Jerry 的原创文章,尽在:” 汪子熙 ”: