首页 > 代码库 > SAPUI5拓展标准应用的Controller原理分析及应用实践

SAPUI5拓展标准应用的Controller原理分析及应用实践

前言

鉴于SAP S/4 HANA的世界性普及,外加中国区云服务的正式落地,作为SAP 移动端用户体验的自有H5框架,也愈加备受关注, 目前SAP大部分产品都是基于SAP Fiori进行定制开发,因此SAP Fiori也提供给客户大量的标准应用,只需要基础运维人员进行安装,即可实现实施应用。

于此同时,基于业务场景的个性化的开发不可或缺,如果能在原理逻辑上稍加修改,这样可以减少很多时间和成本,所以今天我们就来看一下SAP UI5如何实现controller的拓展。

实验分析

SAPUI5是通过合并的方法拓展一个基础的Controller实例, 也就是说会合并标准应用的controller和我们自定义的controller,并应用到我们的拓展应用当中。

由此可见,SAPUI5的拓展方式并不是应用继承,如果在自定义(拓展的)controller中定义了和标准controller同样的名字,标准controler的方法会被覆盖掉。

但是对于生命周期类的方法是例外的,比如:onInit, onExit, onBeforeRendering, onAfterRendering。这些方法并不会覆盖,会被执行两次。

onInit and onAfterRendering: 这两个方法顺序为: 标准 —》 自定义

onExit and onBeforeRendering: 这两个方法为: 自定义 ——》 标准。

接下来我们我们看一具体的例子。

这是一个标准的controller.

sap.ui.controller("samples.components.ext.sap.Main", {
    onInit : function () {
        console.log("samples.components.ext.sap.Main - onInit");
    },

    doSomething: function() {
        alert("this is an original standard action");
    },

    doSomeStandardAction: function() {
        alert("this is another original standard action");
    }
});

这是一个自定义拓展的controller.

sap.ui.controller("samples.components.ext.customer.CustomMain", {
    onInit : function () {
        console.log("samples.components.ext.customer.CustomMain - onInit");
    },

    doSomething: function() {
        alert("this is a customer action");
    },

    doSomeCustomAction: function() {
        alert("this is another customer action");
    }
});

在component.js中指定合并的两个controller文件。这个配置会在自定义拓展应用的component文件中,代码如下:

customizing: {  
    "sap.ui.controllerExtensions": {
        "samples.components.ext.sap.Main": {
            controllerName: "samples.components.ext.customer.CustomMain"
        }
    },
    .....some more content

在拓展应用中,我们可以看到会执行onInit方法两次:

samples.components.ext.sap.Main - onInit
samples.components.ext.customer.CustomMain - onInit

对于doSomething方法,我们在自定义拓展的controler重新定义了一下,这个标准的controler就会被覆盖,我们会看到执行了:

 alert("this is a customer action");

但是对于doSomeCustomAction, doSomeStandardAction两个方法并没有重名,所以不会被覆盖,两者都会执行。

对于自定义的应用,使用Sap 官方webIDE开发效率上非常高,但是如果用Eclipse开发,会存在一些问题,需要做出调整才能在eclipse上运行起来并拓展,所以这里建议大家使用webIDE进行开发。

拓展小技巧: https://help.sap.com/saphelp_uiaddon20/helpdata/en/8f/bf4e728bd146fcb2053aeb6ca741f9/content.htm

<script type="text/javascript"> $(function () { $(‘pre.prettyprint code‘).each(function () { var lines = $(this).text().split(‘\n‘).length; var $numbering = $(‘
    ‘).addClass(‘pre-numbering‘).hide(); $(this).addClass(‘has-numbering‘).parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($(‘
  • ‘).text(i)); }; $numbering.fadeIn(1700); }); }); </script>

    SAPUI5拓展标准应用的Controller原理分析及应用实践