this.getView().byId()、this.byId() 和 sap.ui.getCore().byId() 的区别 [英] Difference Between this.getView().byId(), this.byId(), and sap.ui.getCore().byId()

问题描述

我可以知道使用时的区别和性能吗:

const myControl = this.getView().byId(myIDhere");const myControl = this.byId(myIDhere");const myControl = sap.ui.getCore().byId(myIDhere");

当我在 UI5 应用程序中使用 XML 视图时，最好使用三个中的哪一个来执行控件操作?

解决方案

关于 this.getView().byId 和 this.byId (Recommended)

看看源代码 this.byId 方法:

<块引用>

//sap.ui.core.mvc.ControllerController.prototype.byId = function(sId) {返回 this.oView ?this.oView.byId(sId) :未定义；};

如您所见，this.byId 只是 this.getView().byId 的快捷方式.它们都可以用于访问视图中定义的控件.例如:

<!-- Given --><Panel id="myPanel";/>

myControllerMethod() {const thatPanel = this.byId(myPanel");//=== this.getView().byId(myPanel")},

关于sap.ui.getCore().byId(不要使用)

API sap.ui.getCore().byId(/*...*/) 另一方面，等待一个完全连接的全局 ID 这就是为什么你不能 如果目标控件是视图后代，只需将 this.byId 与 sap.ui.getCore().byId 交换即可.

sap.ui.getCore().byId("__xmlview0--myPanel");//<-- 避免连接 ID 部分！

通常，在开发将添加到 Fiori 启动板 (FLP) 的 UI5 应用程序时，应避免使用 sap.ui.getCore().IE.在控制器中实例化控件时，请记住使用API createId:

<删除>

new Panel("myPanel");

new Panel(this.createId("myPanel"));//通过 this.byId("myPanel") 使其可访问

来自主题 JavaScript 编码问题"不要创建全局 ID"部分:

<块引用>

[...] 您必须不要在 OpenUI5 中为您的控件、片段或视图创建稳定的 ID.这样做可能会导致重复的 ID 错误，从而破坏您的应用程序.尤其是与其他应用一起运行时，可能会出现名称冲突或其他错误.

改用视图或控制器的 createId() 函数.这是在 XMLViews 和 JSONViews 中自动完成的.createId() 函数添加 View ID 作为前缀，从而递归地确保 ID 的唯一性.

有关 ID 的更多信息

• 稳定 ID:您需要知道的一切
• 为了完整起见:如何通过 ID 从 XML 片段访问元素

Can I know the difference and performance when I use:

const myControl = this.getView().byId("myIDhere");
const myControl = this.byId("myIDhere");
const myControl = sap.ui.getCore().byId("myIDhere");

Which of three is best to use to perform operations on control when I use XML views in UI5 apps?

解决方案

About this.getView().byId and this.byId (Recommended)

Take a look at the source code of the this.byId method:

// sap.ui.core.mvc.Controller
Controller.prototype.byId = function(sId) {
  return this.oView ? this.oView.byId(sId) : undefined;
};

As you can see, this.byId is just a shortcut for this.getView().byId. They both can be used to access controls defined in the view. E.g.:

<!-- Given -->
<Panel id="myPanel" />

myControllerMethod() {
  const thatPanel = this.byId("myPanel"); // === this.getView().byId("myPanel")
},

About sap.ui.getCore().byId (Don't use it)

The API sap.ui.getCore().byId(/*...*/) on the other hand, awaits a fully concatenated global ID which is why you cannot simply exchange this.byId with sap.ui.getCore().byId if the target control is a view descendant.

sap.ui.getCore().byId("__xmlview0--myPanel"); // <-- Avoid concatenating ID parts!

Generally, sap.ui.getCore() should be avoided when developing UI5 applications that would be added to Fiori launchpad (FLP). I.e. when instantiating a control in the controller, keep in mind to use the API createId:

new Panel("myPanel");

new Panel(this.createId("myPanel")); // Makes it accessible via this.byId("myPanel")

From the topic "JavaScript Coding Issues" section "Don't create global IDs":

[...] you must not create stable IDs for your controls, fragments, or views in OpenUI5. Doing so might result in duplicate ID errors that will break your app. Especially when running together with other apps, there could be name clashes or other errors.

Use the createId() function of a view or controller instead. This is done automatically in XMLViews and JSONViews. The createId() function adds the View ID as a prefix, thus recursively ensuring uniqueness of the ID.

More about IDs

• Stable IDs: All You Need to Know
• For the sake of completeness: How to Access Elements from XML Fragment by ID

这篇关于this.getView().byId()、this.byId() 和 sap.ui.getCore().byId() 的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！