1.Index.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>UI5 Walkthrough</title> <script id="sap-ui-bootstrap" src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" data-sap-ui-theme="sap_horizon" data-sap-ui-libs="sap.m" data-sap-ui-compatVersion="edge" data-sap-ui-async="true" data-sap-ui-onInit="module:ui5/walkthrough/index" data-sap-ui-resourceroots='{ "ui5.walkthrough": "./" }'> </script> </head> <body> <div>Hello World</div> </body> </html>
src:引用js的目录,此例子引用了远程库的js,项目中会放在本地目录:/resources/sap-ui-core.js
data-sap-ui-them:主题样式
data-sap-ui-libs:使用的库
data-sap-ui-async:异步嗲用
data-sap-ui-onInit:初始化js文件的名字,例子里的index,就是index.js,ui5/walkthrough/和ui5.walkthrough是对应的.
意思是,index.js的位置是ui5.walkthrough对应的目录下。那么ui5.walkthrough对应的具体目录,是在哪里定义的呢?是在下面的data-sap-ui-resourceroots里定义的,
data-sap-ui-resourceroots:定义ui5.walkthrough对应的目录。例子里的【./】的意思是,和index.html在同一个目录。
2.index.js
sap.ui.define([], function() { "use strict"; alert("UI5 is ready"); });
执行效果,会弹出一个警告框,显示UI5 is ready