如何解决错误：“目标 [...] 未定义 viewName”？

Question

我对 SAPUI5 还很陌生，并开始学习有关路由和导航的主题，正如您在他们的文档中看到的那样： https://ui5.sap.com/#/topic/e5200ee755f344c8aef8efcbab3308fb

现在我做了所有的更改，就像他们在文档中所做的那样，但我有一个错误，我不明白为什么会抛出它：

目标概览未定义 viewName。 - EventProvider sap.m.routing.Target

这是清单：

{
  "...": "...",
  "sap.ui5": {
    "_version": "1.1.0",
    "resources": {
      "css": [
        {
          "uri": "css/style.css"
        }
      ]
    },
    "dependencies": {
      "minUI5Version": "1.60",
      "libs": {
        "sap.m": {}
      }
    },
    "...": "...",
    "rootView": {
      "viewName": "sap.ui.startApp.view.App",
      "type": "XML",
      "async": true,
      "id": "app"
    },
    "routing": {
      "config": {
        "routerClass": "sap.m.routing.Router",
        "type": "View",
        "viewType": "XML",
        "path": "sap.ui.startApp.view",
        "controlId": "app",
        "controlAggregation": "pages"
      },
      "routes": [
        {
          "pattern": "",
          "name": "overview",
          "target": "overview"
        },
        {
          "pattern": "detail",
          "name": "detail",
          "target": "detail"
        }
      ],
      "targets": {
        "overview": {
          "id": "overview",
          "name": "Overview"
        },
        "detail": {
          "id": "detail",
          "name": "Detail"
        }
      }
    }
  }
}

Answer 1

解决方案

1. 确保您的 Component.js 首先包含

   { metadata: manifest: "json" }

   。
2. 根据UI5版本：

   • 将

     "async": true

     添加到

     /sap.ui5/routing/config/

     中的

     manifest.json

     （如果版本 < 1.89
     ）

   • 否则，将

     "sap.ui.core.IAsyncContentCreation"

     添加到组件元数据中：

     sap.ui.define([
       "sap/ui/core/UIComponent",
       // ...
     ], function(UIComponent/*,...*/) {
       "use strict";
     
       return UIComponent.extend("my.Component", {
         metadata: {
           interfaces: [
             "sap.ui.core.IAsyncContentCreation", // Available since 1.89.0
           ],
           manifest: "json",
         },
         // ...
       });
     });
     

分析

/sap.ui5/routing/targets

属性

viewName

、

viewId

、

viewPath

和

viewLevel

自UI5 1.58.0起被视为旧语法（作为支持嵌套组件路由计划的一部分） ），因此分别声明

name

、

id

、

path

和

level

而不是

viewName

等是正确的。 *

错误“[...]没有定义

viewName

”实际上来自

sap/ui/core/routing/sync/Target.js

。

/sync

部分表示视图是同步创建的，应该避免这种情况，因为它会在路由过程中阻塞浏览器的 UI 线程。相反，应该异步创建目标，但这需要一个额外的标志，如上所示。

如果目标是异步创建的，错误就会消失。

---

* 如果现有应用程序仍需要迁移到新的

name

、

id

、

path

和

level

语法：

• 添加：

  • "type": "View"

    至

    /sap.ui5/routing/config/

    （参见提交：

    ef476f1

    ）

  • "minUI5Version": "1.98.0"

    或更高至

    /sap.ui5/dependencies/

    （参见提交：

    867496d

    ）
• 财产

  /sap.ui5/rootView/viewName

  不受影响。
• 相关讨论：https://github.com/SAP/openui5/issues/3417