控制器和生命周期方法的 UI5 扩展
UI5 extension of controller and lifecycle methods
我正在尝试创建一个具有通用方法和通用 onInit 逻辑的基本控制器。
使用 extend 方法将方法从基控制器添加到子控制器，但生命周期方法被完全覆盖。
- 我尝试使用 this documentation page 中显示的
override.onInit 方法，但它没有用。
- 我也试过
sap.ui.component like this 但我根本无法让它工作。
我不确定它是否适用于 AMD 语法。
据我所知，扩展功能应该替换已被重写的通用方法，但它应该按照各自的顺序从基础控制器和扩展控制器执行生命周期方法。
所以我的问题如下：
- 这种行为可以实现吗？如果是这样，我做错了什么？
- 有没有更好的实现方式？
示例代码：
父控制器
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"use strict";
return Controller.extend("my.namespace.controller.App", {
onInit: function () {
console.log("reusable init");
},
// ...
});
});
子控制器
sap.ui.define([
"my/namespace/controller/App.controller"
], function (Controller) {
"use strict";
return Controller.extend("my.namespace.child.controller.App", {
onInit: function () {
console.log("extend init");
},
// ...
});
});
当我 运行 应用程序时，此示例仅记录“扩展初始化”。我希望它按此顺序记录“可重用初始化”和“扩展初始化”。
我省略了一些代码，但主要思想体现在这两个控制器上。唯一相关的元数据是基本控制器是抽象的。
我不知道 UI5 中有覆盖机制，它看起来设计过度了...
我猜你使用的是没有适当支持的旧版本。
无论如何，js-inheritance 开箱即用。你需要调用“super”。
sap.ui.define([
"example/BaseController"
], function (BaseController) {
"use strict";
return BaseController.extend("example.BaseController2", {
onInit: function () {
// this is the "super" call
// same happens if you call super() on es6 classes
BaseController.prototype.onInit.apply(this, arguments);
}
});
});
有关更多信息，请查看此处：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
在许多情况下，当从头开发应用程序时，BaseController 方法就足够了，正如 Benedikt 解释的那样，或者您可以尝试使用许多小模块进行组合，具体取决于您的项目。
主题 控制器扩展 鲜为人知，但值得了解它的内容以及扩展如何帮助我们进行应用程序开发。
该文档确实暗示扩展概念通常针对想要扩展 现有 应用程序具有附加功能的开发人员。但扩展也可用于在您自己的应用程序开发中重用一些逻辑。
[Controller extensions] can be used [...] as a reusable part that is added to the original application. (Source)
目前有两种方法：
旧概念 "Component Configuration"
（扩展在 manifest.json 或以前在 Component.js 中声明）
- 旧的 UI5 版本支持。
- 生命周期方法被调用 除了 原始方法（参见下面的 table）。
- 具有相同名称的非生命周期方法被扩展完全覆盖。
- 简单且声明式，但它缺少定义清晰接口的可能性，哪些方法可以按哪些顺序扩展。
参见 this plunk 例如。
新概念称为"Controller Extension"
（使用模块"sap/ui/core/mvc/ControllerExtension" and the methods section within controller's metadata）
- 自 1.56 以来公开记录但 no samples so far。
- 在原始方法（Same 作为旧方法）的基础上 又调用了生命周期方法。
- 提供定义清晰界面的可能性：
- 可见性（
public: true | false）
- 可覆盖性（
final: true | false）
- 执行策略（
overrideExecution: "After" | "Before" | "Instead"）
- 允许通过静态
ControllerExtension.override 方法在基本控制器本身中扩展扩展方法。
- 可用于添加可重用的JS部分（相当于片段概念）。
例如参见this plunk。
生命周期执行顺序
无论哪种情况，UI5 默认按以下顺序执行生命周期方法：
Execution order
Original controller code
Extension code
1.
onInit
2.
onInit
3.
onBeforeRendering
4.
onBeforeRendering
5.
onAfterRendering
6.
onAfterRendering
7.
onExit
8.
onExit
我正在尝试创建一个具有通用方法和通用 onInit 逻辑的基本控制器。
使用 extend 方法将方法从基控制器添加到子控制器，但生命周期方法被完全覆盖。
- 我尝试使用 this documentation page 中显示的
override.onInit方法，但它没有用。 - 我也试过
sap.ui.componentlike this 但我根本无法让它工作。
我不确定它是否适用于 AMD 语法。
据我所知，扩展功能应该替换已被重写的通用方法，但它应该按照各自的顺序从基础控制器和扩展控制器执行生命周期方法。
所以我的问题如下：
- 这种行为可以实现吗？如果是这样，我做错了什么？
- 有没有更好的实现方式？
示例代码：
父控制器
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"use strict";
return Controller.extend("my.namespace.controller.App", {
onInit: function () {
console.log("reusable init");
},
// ...
});
});
子控制器
sap.ui.define([
"my/namespace/controller/App.controller"
], function (Controller) {
"use strict";
return Controller.extend("my.namespace.child.controller.App", {
onInit: function () {
console.log("extend init");
},
// ...
});
});
当我 运行 应用程序时，此示例仅记录“扩展初始化”。我希望它按此顺序记录“可重用初始化”和“扩展初始化”。
我省略了一些代码，但主要思想体现在这两个控制器上。唯一相关的元数据是基本控制器是抽象的。
我不知道 UI5 中有覆盖机制，它看起来设计过度了... 我猜你使用的是没有适当支持的旧版本。
无论如何，js-inheritance 开箱即用。你需要调用“super”。
sap.ui.define([
"example/BaseController"
], function (BaseController) {
"use strict";
return BaseController.extend("example.BaseController2", {
onInit: function () {
// this is the "super" call
// same happens if you call super() on es6 classes
BaseController.prototype.onInit.apply(this, arguments);
}
});
});
有关更多信息，请查看此处：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
在许多情况下，当从头开发应用程序时，BaseController 方法就足够了，正如 Benedikt 解释的那样，或者您可以尝试使用许多小模块进行组合，具体取决于您的项目。
主题 控制器扩展 鲜为人知，但值得了解它的内容以及扩展如何帮助我们进行应用程序开发。
该文档确实暗示扩展概念通常针对想要扩展 现有 应用程序具有附加功能的开发人员。但扩展也可用于在您自己的应用程序开发中重用一些逻辑。
[Controller extensions] can be used [...] as a reusable part that is added to the original application. (Source)
目前有两种方法：
旧概念 "Component Configuration"
（扩展在manifest.json或以前在Component.js中声明）- 旧的 UI5 版本支持。
- 生命周期方法被调用 除了 原始方法（参见下面的 table）。
- 具有相同名称的非生命周期方法被扩展完全覆盖。
- 简单且声明式，但它缺少定义清晰接口的可能性，哪些方法可以按哪些顺序扩展。
参见 this plunk 例如。
新概念称为"Controller Extension"
（使用模块"sap/ui/core/mvc/ControllerExtension"and themethodssection within controller'smetadata）- 自 1.56 以来公开记录但 no samples so far。
- 在原始方法（Same 作为旧方法）的基础上 又调用了生命周期方法。
- 提供定义清晰界面的可能性：
- 可见性（
public: true | false） - 可覆盖性（
final: true | false） - 执行策略（
overrideExecution: "After" | "Before" | "Instead"） - 允许通过静态
ControllerExtension.override方法在基本控制器本身中扩展扩展方法。
- 可见性（
- 可用于添加可重用的JS部分（相当于片段概念）。
例如参见this plunk。
生命周期执行顺序
无论哪种情况，UI5 默认按以下顺序执行生命周期方法：
| Execution order | Original controller code | Extension code |
|---|---|---|
| 1. | onInit |
|
| 2. | onInit |
|
| 3. | onBeforeRendering |
|
| 4. | onBeforeRendering |
|
| 5. | onAfterRendering |
|
| 6. | onAfterRendering |
|
| 7. | onExit |
|
| 8. | onExit |