SAP之FIORI(7)-MVC加载模式

SAP之FIORI(7)-MVC加载模式

MVC 是Model、View、Controller的简称，用于将程序的数据、界面展示和用户交互分离，通过这种分离，可以简化开发，以及让某部分变动的时候，不需要影响其他部分，从而降低耦合。 Model:代表应用程序的数据(oDataModel、jsonModel) View:代表应用程序的用户界面(xml、js、html、json) Controller:处理应用程序数据和用户交互(js)  

不使用MVC的功能，我们的代码都会卸载index.html中 View中有两个函数，getControllerName 函数用户返回controller name，createContent函数用户返回页面上要显示的内容

 

MVC文件的名称和位置 使用MVC，model、view和controller的代码放在不同的文件中，SAPUI5如何确定view和controller文件的名称和位置呢？ 一般有三种方法声明文件的位置 sap.ui.localResources() -如果出现在了index.html中，那么意思就是将index.html文件所在的文件夹作为框架查找相关文件的文件夹。如果sModuleNamePrefix含有点(dot)号，所有的点被替换为/。 jQuery.sap.registerModulePath(sModuleNamePrefix，sURL); 和上面一样的功能但是更加的灵活 bootstrap声明 data-sap-ui-resourceroots='{"name":""}' 

 

项目名

MVC01

webapp/index.html

	
		
		

		demo

		
		

		
     sap.ui.localResources("resource");
     var app = new sap.m.App({initialPage:"idmaster1"});
     var page = sap.ui.view({
     	id:"idmaster1",
     	viewName:"resource.master",
     	type:sap.ui.core.mvc.ViewType.JS});
     	app.addPage(page);
     	app.placeAt("content");
		
	

	
		

	

webapp/resoure/master.controller.js

sap.ui.controller("resource.master",{
    onButtonPressed:function(){
    	jQuery.sap.require("sap.m.MessageBox");
    	sap.m.MessageBox.information("Hello from MVC.",{
    		title:"SAPUI5 MVC test"
    	});
    }	
    
/*    
    onInit:function(){
    	
    },
    onBeforeRendering:function(){
    	
    },
    onAfterRendering:function(){
    	
    },
    onExit:function(){
    	
    }*/
    
});

webapp/resource/master.view.js

sap.ui.jsview("resource.master", {
	getControllerName:function(){
		return "resource.master";
	},
	createContent:function(oController){
	var oButton = new sap.m.Button({
		text:"Click me",
		press: oController.onButtonPressed
	});
	return oButton;
	}
});

点击