组件得到错误.getView不是一个函数

Component gets error this.getView is not a function

本文关键字：一个 函数 错误 getView 组件      更新时间：2023-09-26

我将在sapui5的讲解教程，并设法得到第9步，它教你如何使用Component.js文件在您的应用程序

现在，在使用Component.js之前，应用程序中的一切都运行良好。然而，一旦我尝试使用组件，我得到这个错误:

Uncaught TypeError: this.getView is not a function

参考uiccomponent .js第6行。尽管我的组件文件只是叫做component .js。我还得到:

GET http://localhost:58736/InvoicesApp/invoicesapp/Component-preload.js 404 (Not Found)

但我不确定它们是否相关

这是我的index.html

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m"
                data-sap-ui-theme="sap_bluecrystal"
                data-sap-ui-bindingSyntax="complex"
                data-sap-ui-compatVersion="edge"
                data-sap-ui-preload="async"
                >
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
        <script>
                sap.ui.localResources("invoicesapp");
                sap.ui.getCore().attachInit(function () {
                     new sap.ui.core.ComponentContainer({
                           name : "invoicesapp"
                        }).placeAt("content");
                 });
        </script>
    </head>
    <body class="sapUiBody" id="content"/>
</html>
我Component.js 

sap.ui.define([
   "sap/ui/core/UIComponent",
   "sap/ui/model/json/JSONModel",
   "sap/ui/model/resource/ResourceModel"
], function (UIComponent,  JSONModel, ResourceModel) {
   "use strict";
   return UIComponent.extend("invoicesapp.Component", {
       metadata: {
           rootView:"invoicesapp.view.App"
       },
      init : function () {
         // call the init function of the parent
         UIComponent.prototype.init.apply(this, arguments);
         
      // set data model on view
         var oData = {
            recipient : {
               name : "World"
            }
         };
         var oModel = new JSONModel(oData);
         this.getView().setModel(oModel);
     // set i18n model on view
         var i18nModel = new ResourceModel({
            bundleName: "invoicesapp.i18n.i18n"
         });
         this.getView().setModel(i18nModel, "i18n");
    }
   });
});

我的控制器

sap.ui.define([
   "sap/ui/core/mvc/Controller",
   "sap/m/MessageToast",
   "sap/ui/model/json/JSONModel",
   "sap/ui/model/resource/ResourceModel"
], function (Controller, MessageToast, JSONModel, ResourceModel) {
   "use strict";
   return Controller.extend("invoicesapp.controller.App", {
    
      onShowHello : function () {
          
         // read msg from i18n model
         var oBundle = this.getView().getModel("i18n").getResourceBundle();
         var sRecipient = this.getView().getModel().getProperty("/recipient/name");
         var sMsg = oBundle.getText("helloMsg", [sRecipient]);
         // show message
         MessageToast.show(sMsg);
      }
   });
});

在组件中你不能调用this.getView()，因为没有getView()， api文档在https://openui5beta.hana.ondemand.com/#docs/api/symbols/sap.ui.core.Component.html

相反，您可以直接在组件本身上设置模型。换句话说，只需调用

this.setModel(oModel);

和

this.setModel(i18nModel, "i18n");

顺便说一下:在指南中也是这样做的。

this.getView()将不会在component.js中被定义，因为view还没有被实例化。

你可以简单地用this.setModel(oModel)来设置model，也可以用this.setModel(oModel，"modelName");

我在进行遍历时也遇到了同样的问题。

View没有在组件中实例化。

可以重写为

this.setModel("myModel);

对于i18n

this.setModel(i18nModel,"i18n");

这个错误是有走过，但现在它似乎修复了。在我学习的时候，SAP UI5教程有一些错误，但是他们现在已经修复了大部分错误。

这也是开始使用UI5的一个很好的来源。和Demokit差不多

HTML5 UI开发工具包

快乐编码

Febin多米尼克

相关文章：