SAP UI5 Step 6: Modules

Step 6: Modules

SAPUI5에서 자원은 종종 "모듈"이라고 합니다. 이 단계에서는 지난 연습의 alert을 sap.m 라이브러리의 적절한 "Message Toast"로 바꿉니다. 필요한 모듈을 비동기적으로 로드 할 수 있습니다.

Preview

Coding

You can view and download all files in the Explored app in the Demo Kit at Walkthrough - Step 6.

webapp/controller/App.controller.js

sap.ui.define([
   "sap/ui/core/mvc/Controller",
   "sap/m/MessageToast"
], function (Controller, MessageToast) {
   "use strict";
   return Controller.extend("sap.ui.demo.wt.controller.App", {
      onShowHello : function () {
         MessageToast.show("Hello World");
      }
   });
});

필요한 모듈의 배열을 sap.m.MessageToast의 정규 경로로 확장합니다. Controller와 MessageToast 모듈이 모두 로드되면 콜백 함수가 호출되고 함수에 전달된 매개 변수에 액세스하여 두 객체를 모두 사용할 수 있습니다.

이 비동기 모듈 정의 (AMD) 구문을 사용하면 모듈 로딩을 코드 실행과 명확하게 구분할 수 있으며 응용 프로그램의 성능이 크게 향상됩니다. 브라우저는 코드가 실행되기 전에 리소스가 로드되는 시기와 방법을 결정할 수 있습니다.

Conventions

- Global namespace를 정의하려면 컨트롤러 및 다른 모든 JavaScript 모듈에 sap.ui.define을 사용하십시오. 네임 스페이스를 사용하면 응용 프로그램 전체에서 객체를 처리 할 수 ​​있습니다.

- 비동기적 Loading 종속성(asynchronously loading dependencies)을 위하여 namespace 선언하지 않고 sap.ui.require를 사용하십시오. 예를 들어 실행만하면 되지만 다른 코드에서 호출 될 필요는 없습니다.

- 네임 스페이스가없는 function parameter의 이름을 로드하려면 artifact의 이름을 사용하십시오.