关于sap:SAP-UI5-的-sapuibootstrap-script-脚本标签各属性解析

5次阅读

共计 1820 个字符，预计需要花费 5 分钟才能阅读完成。

看这段测试代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>SAPUI5 Walkthrough</title>
    <script
        id="sap-ui-bootstrap"
        src="./resources/sap-ui-core.js"
        data-sap-ui-theme="sap_fiori_3"
        data-sap-ui-libs="sap.m"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-async="true"
        data-sap-ui-resourceroots='{"sap.ui.demo.walkthrough":"./"}'
        data-sap-ui-oninit="module:sap/ui/demo/walkthrough/index">
    </script>
</head>
<body>
<div>Hello World</div>

</body>
</html>

运行之后，会弹出一个 Alert 对话框。

代码关键点逐行解释：

指定主题为 sap-fiori-3.

详情参考文章：SAP UI5 利用指定主题 theme 的几种形式和其优先级

要在 HTML 页面中应用 SAPUI5 性能，您必须加载并初始化 SAPUI5 库。

您能够在页面中应用 SAPUI5 疏导程序脚本，以便在浏览器加载和执行脚本后主动初始化 SAPUI5 运行时。对于简略的用例以及默认的 SAPUI5 装置，这足以构建和运行 UI。除此之外，您能够在配置设置中指定一组 SAPUI5 库和用于您的应用程序的主题。这通过 script 的属性 data-sap-ui-libs 来实现。

如果咱们删除上图第 10 行的 data-sap-ui-libs 属性以及 sap.m, 整个利用依然可能失常运行，那为什么咱们还须要这一行代码呢？

data-sap-ui-libs 由 UI5 Core 的疏导程序思考。该框架将确保预加载 data-sap-ui-libs 属性中列出的所有库，而后才触发应用程序能够附加到的 init 事件。当您删除库预加载时，这可能导致库的每个所需模块的单个申请，在最坏的状况下是同步申请并导致性能问题（您能够在网络跟踪中看到这一点）。然而，如果您开发了 UI5 应用程序（组件）并且在清单中正确保护了库依赖项，则应用程序 / 组件加载器会在应用程序 / 组件初始化之前小心地为您预加载这些库。

留神：如果您独立运行应用程序，则疏导程序将增加到您的 HTML 页面中。在 SAP Fiori 启动板环境中，启动板执行疏导程序，不须要额定的 HTML 页面来显示应用程序。

这个属性和 SAP UI5 的兼容性设计无关。

兼容性版本标记容许应用程序对 SAPUI5 中不兼容的更改做出反馈。

如兼容性规定中所述，对 SAPUI5 性能的更改是兼容的，请参阅兼容性规定。然而，在某些状况下，更改性能的行为可能是有意义的，例如更改默认值或应用优化的实现，而这些更改可能会导致不兼容。

兼容版本配置工作如下：

(1) 如果性能更改不兼容，则会引入版本标记。

(2) 版本标记必须在 SAPUI5 疏导标记中定义为全局（data-sap-ui-compatVersion 或为每个性能独自定义（例如 data-sap-ui-compatVersion-xyz）.

看个例子：

<script id="sap-ui-bootstrap" 
        type="text/javascript"
        src="resources/sap-ui-core.js"
        data-sap-ui-theme="sap_blue_crystal"
        data-sap-ui-libs="sap.ui.commons"
        data-sap-ui-compatVersion="1.18"
        data-sap-ui-compatVersion-<featureName>="1.16"
        >
    </script>

如果未定义版本，则利用该性能的默认行为。

如果指定了显式版本，则利用指定版本的行为。

如果指定了 edge 版本，则利用该性能的最新行为。

对于剩下的 data-sap-ui-async，data-sap-ui-resourceroots 和 data-sap-ui-oninit 的含意，请参阅我的博客：SAP UI5 初学者教程之二：SAP UI5 的疏导过程。

正文完