SAPUI5 了解 manifest.json:rootView 以及如何将页面分配给应用程序

Question

我正在尝试使用 JSViews 开发我的 UI5 应用程序。我想使用 manifest.json 文件来定义 rootView，但我不确定应该在哪里实例化 sap.m.App、sap.m.Page 然后在哪里调用 sap.m.app:addPage & sap.m.app:placeAt 渲染它。

我使用 https://github.com/SAP/openui5-sample-app 作为如何构建应用程序的参考点（使用 XML 视图 而不是 JS 浏览量)

在我遵循的第一个教程中，我在 index.html 中创建了应用程序和页面，如下所示：

var app = new sap.m.App({initialPage:"logonPage"});
var page = sap.ui.view({id:"logonPage", viewName:"views.logon", type:sap.ui.core.mvc.ViewType.JS});
app.addPage(page);
app.placeAt("content");

但是对于 sample-app，index.html file doesn't contain any JS at all - instead it seems that App is created by the XML view, and the App and the view together are loaded as the starting point by the manifest.json

在JS视图中实例化new app并在createContent方法中使用placeAt似乎不对。 您应该如何使用 JS 视图执行相同的操作？。我应该让 JS 在 index.html 中创建应用程序和页面吗？

Answer 1

出于安全原因，index.html 不应再包含代码（bootstrap 脚本除外）。这有点新，因此您会发现很多教程将 Shell-Container 之类的东西或在您的示例中将页面直接放置到 html 正文中。

在您的主视图中，您必须使用强制函数 "createContent"，您必须从中 return 应该呈现什么。这是 JS 视图的基本实现：

sap.ui.jsview("test.Test.view.View1", {
  getControllerName: function () {
    return "test.Test.controller.View1";
  },
  createContent: function (oController) {
    var oPage = new sap.m.Page({
        title: "{i18n>title}",
        content: []
    });

    var app = new sap.m.App("myApp", {
        initialPage: "oPage"
    });
    app.addPage(oPage);
    return app;
  }
});

在这种情况下，我的 "test.Test.view.View1" 必须在清单文件中设置为 rootView。

查看 here 了解有关如何初始化应用程序的更多信息。

看一看here，了解定义 JS 视图的基础知识。

SAPUI5 了解 manifest.json:rootView 以及如何将页面分配给应用程序

SAPUI5 Understanding manifest.json:rootView and how to assign page to app

sapui5

manifest.json