程序员经验分享-hwhale

SAPUI5 使用 XML 文件作为带有“data-sap-ui-resourceroots”的视图？

2023-12-12

我正在做 SAPUI5 演练并卡在步骤 4 上。（演练步骤 4）

我正在使用 Eclipse，但不知道如何更改此代码行，以便它适用于我的项目，并且将找到我的视图。

         data-sap-ui-resourceroots='{
        "sap.ui.demo.wt": "./"
     }'

我需要知道使用 Eclipse 项目时为“sap.ui.demo.wt”插入什么。

感谢您的任何提示:)

EDIT:

现在我得到了一个带有触发弹出窗口的按钮的工作页面。

文件夹结构：

SAPUI5_Test
 - WebContent
    - controller
       -> NewView.controller.js
    - view
       -> NewView.view.xml
    - index.html

索引.html：

    <!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta charset="UTF-8">
    <title>SAPUI5 Walkthrough</title>
    <script
        id="sap-ui-bootstrap"
        src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
        data-sap-ui-theme="sap_bluecrystal"
        data-sap-ui-libs="sap.m"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-preload="async"
        data-sap-ui-resourceroots='{
            "SAPUI5_Test": "./"
        }'>
    </script>
    <script>
        sap.ui.getCore().attachInit(function () {
            sap.ui.xmlview({
                viewName: "SAPUI5_Test.view.NewView"
            }).placeAt("content");
        });
    </script>
</head>
<body class="sapUiBody" id="content">
</body>
</html>

NewView.view.xml：

<mvc:View
controllerName="SAPUI5_Test.controller.NewView"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Button 
text="Say hello"
press="onShowHello"/>
</mvc:View>

NewView.controller.js

sap.ui.controller("SAPUI5_Test.controller.NewView", {
    onShowHello : function() {
        alert("Hello SAPUI5_Controller");
    }
});

所以感谢您的帮助！也许这可以帮助将来的人:)


SAPUI5 通过全名搜索视图、控制器或其他类等资源。

假设每个命名空间部分都是一个文件夹，类/视图名称是文件名。如果它是视图，则文件名必须是 xxx.view.xml。如果它是控制器，文件名必须是 xxx.controller.js。

默认情况下，它开始搜索的根文件夹是 sap-ui-core.js 的文件夹。

您可以通过定义 data-sap-ui-resourceroots 映射来更改根文件夹。它是一个 javascript 对象，将命名空间映射到路径（相对于 index.html）。

使用以下引导标签company.myProject.view.View1搜索于/resources/company/myProject/view/View1.view.xml:

<script id="sap-ui-bootstrap" 
    src="resources/sap-ui-core.js"></script>

有了这个引导标签company.myProject.View1搜索于/view/View1.view.xml:

<script id="sap-ui-bootstrap" 
    src="resources/sap-ui-core.js"
    data-sap-ui-resourceroots='{
      "company.myProject": "./" }'></script>

并使用这个引导标签company.myProject.View1搜索于ddd/myProject/view/View1.view.xml:

<script id="sap-ui-bootstrap" 
    src="resources/sap-ui-core.js"
    data-sap-ui-resourceroots='{
      "company": "./ddd" }'></script>

编辑：请注意，您必须使用"地图内部。'不管用。

编辑：文件夹结构的澄清

我建议您将所有内容都放在项目名称空间中。使用此文件夹结构：

WebContent
- controller
  - NewView.controller.js
- view
  - NewView.view.xml
- index.html
  • Rename View文件夹到view（命名空间按照惯例采用驼峰命名法）。
  • Rename newView.view.xml to NewView.view.xml（按照惯例，类/视图采用 PascalCase）
  • Use data-sap-ui-resourceroots='{ "myproject": "./" }'.
  • 将您的控制器名称更改为myproject.controller.NewView: Controller.extend("myproject.controller.NewView", {...}); or sap.ui.controller("myproject.controller.NewView",{...});.
  • 在 xmlview 中使用controllerName="myproject.controller.NewView".
  • 实例化视图sap.ui.xmlview({ viewName: "myproject.view.NewView"}).placeAt("content");.

这样您就不必为项目中的每个子文件夹添加映射。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

xml

eclipse

View

sapui5

SAPUI5 使用 XML 文件作为带有“data-sap-ui-resourceroots”的视图？ 的相关文章

随机推荐

热门标签