sapui5 - 以 "sap.ui.define"风格编写 SAPUI5 控件渲染器

Question

我想以新的 sap.ui.define 方式编写自定义控件。我在单独的文件中实现控件呈现器时遇到问题:似乎必须放置 bExport = true，而这是 forbidden by SAP .

bExport: whether an export to global names is required - should be used by SAP-owned code only

我还没有找到任何不使用 export hack 的渲染器实现示例，我怀疑这种方式是否存在。

我有一些建议，但它们并不完全令我满意:

• 忽略 SAP 要求并使用 bExport = true。优点:SAP 代码的最高重用率并且通常遵循标准逻辑。缺点:避免官方推荐。
• 在工厂函数中显式设置 my.namespace.control.GreatControlRenderer。优点:简单，不涉及 bExport。缺点:破坏了模块化设计(因为模块实际上设置了全局变量)。

解决此问题的最佳或推荐方法是什么？

---

从技术上讲，一个可供公众使用的对象引用是在框架代码中用 jQuery.sap.setObject 创建的方法，都在:

1. sap.ui.core.Control.extend() -- 实际上在父类方法中 sap.ui.base.Metadata.createClass()
2. sap.ui.define(/* bExport = */ true)

此方法通过对象 dot.separated.qualified.name 在全局范围内创建对象层次结构，如下所示:

jQuery.sap.setObject = function(sName, vValue, oContext) {
  var oObject = oContext || window,
      aNames = (sName || "").split("."),
      l = aNames.length,
      i;

  if (l > 0) {
    for (i = 0; oObject && i < l - 1; i++) {
      if (!oObject[aNames[i]]) {
        oObject[aNames[i]] = {};
      }
      oObject = oObject[aNames[i]];
    }
    oObject[aNames[l - 1]] = vValue;
  }
};

Answer 1

首先，您的渲染器是一个具有渲染功能的对象。这是一个静态函数。从您的模块中返回此渲染器。

sap.ui.define([], function(){
  "use strict";
  var MyControlRenderer = {};
  MyControlRenderer.apiVersion = 2;
  MyControlRenderer.render = function(oRm, oControl){
    // Render your control
  };
  return MyControlRenderer;
});

然后在您的控件中，导入您的渲染器对象并将其分配给控件的渲染器属性，如下所示:

sap.ui.define([
  "sap/ui/core/Control",
  "./MyControlRenderer"
], function(Control, MyControlRenderer) {
  "use strict";
  var MyControl = Control.extend("bla.MyControl", {
    metadata: {
      // ...
    },
    renderer: MyControlRenderer
  });
  return MyControl;
});

在此示例中，渲染器与控件位于同一目录中。