SAP UI5 的初始化过程
加載 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.com/resources/sap/ui/core/themes/base/library.css
當所有庫都加載完畢并且文檔準備就緒時,內核的 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><scriptid="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 //resources//library.js
library.js 是一個 JavaScript 文件,其中包含庫提供的所有枚舉類型的 JavaScript 代碼以及獨立于庫中控件的特定于庫的初始化代碼。該文件調用 sap.ui.getCore().InitLibrary 方法,其中包含一個描述庫內容的對象(包含的控件列表、元素等)。對于使用 SAPUI5 應用程序開發工具或 SAPUI5 離線構建工具開發的庫,此文件在構建過程中自動生成。
(2) Library style sheet file //resources//themes//library.css
包含與此庫相關的所有樣式的標準 CSS 文件。對于應用程序開發工具,此文件在構建期間自動生成。
Dynamic Loading of Libraries
SAPUI5 提供了 sap.ui.getCore().loadLibary() 方法,除了運行時配置中聲明的庫外,還提供了運行時加載庫。
加載后,您可以使用庫中的所有控件。 對于這些額外的庫,同樣的限制適用于聲明的庫:只有在 HTML 頁面的 document.ready 事件之后才能訪問文檔對象模型 (DOM)。 此外,渲染適用于這些庫的方式與聲明的庫相同。
更多Jerry的原創文章,盡在:“汪子熙”:
總結
以上是生活随笔為你收集整理的SAP UI5 的初始化过程的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: java中使用sublist方法获取li
- 下一篇: 比亚迪与厄瓜多尔经销商 Andor 达成