Fiori WalkThrough 10 项目结构变化与Fiori项目初始化流程

变化

WalkThrough 10 相较于之前的QuickStart 3，在项目结构上主要有以下变化：

• 移除了index.js，新增Component.js
  • Component.js取代了index.js，负责Fiori项目的初始化、配置和生命周期的管理
  • index.html中不再指定初始化脚本index.js，取而代之的是通过module:sap/ui/core/ComponentSupport模块来调用Component.js进行初始化
• manifest.json承担了更多的工作

虽然 manifest.json 和 Component.js 都涉及某些配置和初始化工作，但它们在使用上是互补的。

Fiori项目初始化流程

启动index.html，加载SAP UI5核心库

加载 ComponentSupport 模块

通过index.html中的 data-sap-ui-onInit="module:sap/ui/core/ComponentSupport" 属性会自动加载 sap/ui/core/ComponentSupport 模块。

查找组件标记并加载组件

ComponentSupport 模块会查找页面中带有 data-sap-ui-component 属性的 HTML 元素，并根据 data-name 属性加载对应命名空间下的的组件。

加载并执行 Component.js

Component.js 定义了应用程序组件的初始化逻辑。

其中的元数据（metadata）还定义了下一步会指向的 manifest.json 文件。

读取 manifest.json

manifest.json 文件是应用程序的配置文件，包含应用的元数据、组件配置、路由配置、数据源等信息。

初始化路由和模型

根据 manifest.json 中的配置，Component.js 中的初始化方法会设置路由、创建并设置模型。（目前的Demo项目中还未涉及到这一块的内容，后续的WalkThrough会有相应的介绍）

加载并显示根视图

在 manifest.json 中，rootView 配置指定了应用程序的根视图。该视图会被加载并显示在页面上。

完成初始化