如何正确使用新的异步片段加载

How to properly use the new asynchronous fragment loading

这里是OpenUI5新手。我正在尝试使用 OpenUI5 片段,就像文档中的演练示例步骤 16 中所示。我无法理解它如何正常工作。

下面的代码是从文档中的演练示例第 16 步复制和粘贴的:

onOpenDialog : function () {
  var oView = this.getView();

  // create dialog lazily
  if (!this.byId("helloDialog")) {
    // load asynchronous XML fragment
    Fragment.load({
      id: oView.getId(),
      name: "sap.ui.demo.walkthrough.view.HelloDialog"
      }).then(function (oDialog) {
        // connect dialog to the root view of this component
        oView.addDependent(oDialog);
        oDialog.open();
      });
  } else {
    this.byId("helloDialog").open();
  }
}

由于 HelloDialog 片段是异步加载的,很明显 onOpenDialog 函数可能 return 在创建和打开对话框之前向用户控制。异步调用的本质是我们不能对执行异步代码需要多长时间做出任何假设。世事皆可能。因此,我们必须考虑到在对话框出现之前用户可以控制网页的可能性,例如几秒钟。用户要做什么?他们将一次又一次地单击打开对话框的按钮,从而多次创建对话框,从而破坏代码的预期逻辑。老实说,我不确定我是否愿意在我的代码中使用这种东西。我该如何处理?

总的来说,你是对的,加载对话框可能需要一些时间,但通常,该过程只需要一小部分时间,用户不应该看到任何 "loading" 时间。

只有当您的对话框也异步加载数据时才有可能。

如果您真的想确保向用户提供图形反馈,您可以这样做:

onOpenDialog : function () {
    var oView = this.getView();

    // create dialog lazily
    if (!this.byId("helloDialog")) {]
        // set the view to busy state
        oView.setBusy(true);
        // load asynchronous XML fragment
        Fragment.load({
            id: oView.getId(),
            name: "sap.ui.demo.walkthrough.view.HelloDialog"
        }).then(function (oDialog) {
            // remove the busy state
            oView.setBusy(false);
            // connect dialog to the root view of this component (models, lifecycle)
            oView.addDependent(oDialog);
            oDialog.open();
        });
    } else {
        this.byId("helloDialog").open();
    }
}