找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
SAP亦橙网 首页 SAP技术 查看内容

SAP UI5 - MVC

2023-12-21 10:07| 发布者: 亦书| 查看: 100| 评论: 0

摘要: SAP UI5 - MVC今天准备系统的学习一下UI5的MVC概念1. ViewUI5的view一共分为4中, JS/XML/JSON/HTML view,1.1 JS View,通过JS代码 ,返回UI控件,getControllerName, 用于获取对应的Controler, createContent方法会 ...
 

SAP UI5 - MVC

今天准备系统的学习一下UI5的MVC概念

1. View

UI5的view一共分为4中, JS/XML/JSON/HTML view, 

1.1 JS View,通过JS代码 ,返回UI控件,getControllerName, 用于获取对应的Controler, createContent方法会在Controller初始化之后被调用,返回UI控件

代码如下:

 1  sap.ui.jsview("sap.hcm.Address", {
 2    
 3    getControllerName: function() {
 4       return "sap.hcm.Address";  
 5         },
 6 
 7    createContent: function(oController) {
 8       var oButton = new sap.ui.commons.Button({text:"Hello JS View"});
 9       oButton.attachPress(oController.handleButtonClicked);
10       return oButton;
11    }
12 
13 });

1.2 XML View

通过XML直接写控件,代码如下:

<mvc:View controllerName="sap.hcm.Address" xmlns="sap.ui.commons" xmlns:mvc="sap.ui.core.mvc">
   <Panel>
      <Image src="http://www.sap.com/global/ui/images/global/sap-logo.png"/>
      <Button text="Press Me!"/>
   </Panel>
</mvc:View>

返回一张图片以及一个按钮

1.3 JSON View

通过JSON格式定义View,代码如下:

 1 { 
 2    "Type":"sap.ui.core.mvc.JSONView",
 3    "controllerName":"sap.hcm.Address",
 4    "content": [{
 5       "Type":"sap.ui.commons.Image",
 6       "id":"MyImage",
 7       "src":"http://www.sap.com/global/ui/images/global/sap-logo.png"
 8    },
 9    {
10       "Type":"sap.ui.commons.Button",
11       "id":"MyButton",
12       "text":"Press Me"
13 
14    }]
15 
16 }

效果同1.2

1.4 HTML View ,就是直接写HTML代码,代码略

 

2. Controller

Controller是写在prefix.controller.js中的 这边前缀名和View是保持一致的。

Controller主要有四个方法

  onInit():在View被实例化后调用,可以用来第一次展示View的时候做一些修改,或者其他一些初始化操作

  onExit():当View被destroy的时候调用,可以用来释放资源

  onAfterRendering():当View被渲染(render)的时候调用

  onBeforeRendering():在View被重新渲染前调用,在第一次渲染前不会被调用

3. Model

数据源, 主要有JSON/XML/OData 三种Model.


特别声明:文章或部分素材来源于网络,仅供SAPERP从业伙伴们交流学习使用,如果侵犯了您的权益,请联系网站管理人员删减!


路过

雷人

握手

鲜花

鸡蛋
上一篇:SAP HANA数据库 EBS下一篇:SAP产品价格
返回顶部