如何重用 SAPUI5 视图?

问题描述

我为一个 SAP UI5 页面创建了一个标题，现在我想在另一个页面中有一个包含几乎相同组件的类似标题.因此，为了代码重用，我尝试:

I created a header for one SAP UI5 page, now I want to have a similar header with almost the same components in another page. So, for the sake of code reuse I tried to:

• 将标题放在单独的 UI5 视图中
• 用 var pageHeader = sap.ui.jsview("appHeader","view.appHeader") 创建这个头实例；
• 将pageHeader作为内容添加到customHeader字段中的页面

但这不起作用，没有给出任何错误！那么是否可以通过视图重用自定义 UI 组件，如果是，如何做到这一点?

But this did not work, without given any errors!So is it possible to reuse custom UI components via a view and if yes how to do that?

推荐答案

这个问题可能与使用sap.ui.jsview的几个variant有关:

This problem is probably related to the several varaints of using sap.ui.jsview:

• 查看定义
• 查看实例化

调用 var pageHeader = sap.ui.jsview("appHeader","view.appHeader") 要求框架查找名称为 "view.appHeader" 在您的项目中.如果有一个具有此名称的视图，它将创建它的一个新实例并为其分配 ID "appHeader".如果您在应用程序的多个模块中使用相同的语句，您会要求框架每次都创建一个具有相同 ID 的视图实例.这可能会导致以下错误:添加具有重复 ID 'appHeader' 的元素.因此，在重用视图时，请避免在实例化中使用 ID 参数.

Calling var pageHeader = sap.ui.jsview("appHeader","view.appHeader") asks the framework to look for a view with the name "view.appHeader" in your project. If there is a view with this name it will create a new instance of it and assigns it the ID "appHeader". If you use the same statement in several modules of your application you ask the framework to create an instance of the view with the same ID everytime. This will probably result in the following Error:adding element with duplicate id 'appHeader'. So when reusing a view avoid using the ID parameter in your instantiation.

重用视图时还应该考虑的另一件事:由于视图有一个名为 getControllerName 的函数，它返回用于此视图的控制器的名称，因此框架将创建此控制器的新实例对于您实例化的每个视图.这不是不良行为，但应该知道以避免出现问题.

One more thing you should consider when reusing a view: Since a view has a function called getControllerName which returns the name of the controller used for this view the framework will create a new instance of this controller for each view you instantiate. This is no bad behaviour but should be known to avoid problems.

概览:

查看定义:

sap.ui.jsview(sId, vView) // (e.g. in pageHeader view file)

视图实例化:

sap.ui.jsview(sName) // (e.g. calling/reusing it in several files)

就您而言:

var pageHeader = sap.ui.jsview("view.appHeader") 应该这样做.

编辑/附录:

从 UI5 1.15 版开始，您还可以使用片段作为重用视图的轻量级替代方案.文档 有一些很好的例子并解释了片段的优点以及它们与普通视图的区别.

Since version 1.15 of UI5 you can also use fragments as a lightweight alternative for reusing views. The documentation has some nice examples and explains the advantages of fragments and how they differ from normal views.

这篇关于如何重用 SAPUI5 视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！