SAP UI5 初学者教程之十四 - 嵌入视图的使用方式试读版
一套適合 SAP UI5 初學者循序漸進的學習教程
教程目錄
-
SAP UI5 本地開發環境的搭建
-
SAP UI5 初學者教程之一:Hello World
-
SAP UI5 初學者教程之二:SAP UI5 的引導過程 Bootstrap
-
SAP UI5 初學者教程之三:開始接觸第一個 SAP UI5 控件
-
SAP UI5 初學者教程之四:XML 視圖初探
-
SAP UI5 初學者教程之五:視圖控制器初探
-
SAP UI5 初學者教程之六 - 了解 SAP UI5 的模塊(Module)概念
-
SAP UI5 初學者教程之七 - JSON 模型初探
-
SAP UI5 初學者教程之八 - 多語言的支持
說明
Jerry 從 2014 年加入 SAP成都研究院 CRM Fiori 開發團隊之后開始接觸 SAP UI5,曾經在 SAP 社區和“汪子熙”微信公眾號上發表過多篇關于 SAP UI5 工作原理和源碼解析的文章。
在 Jerry 這篇文章 對 SAP UI5 一無所知的新手,從哪些材料開始學習比較好? 曾經提到,Jerry 也是從 SAP UI5 菜鳥一路走過來,深知只有 ABAP 開發背景的開發者,向 SAP UI5 開發領域轉型的不易,因此我在業余時間設計了這份適合 SAP UI5 初學者的學習教程,把開發一個完整的 SAP UI5 應用的流程,拆分成若干個步驟,力求每個步驟里,把涉及到的知識點都涵蓋到。這些知識點可能不像我的 UI5 源碼分析系列文章那么深入,但力求淺顯易懂,便于 SAP UI5 初學者理解。
本教程每一個步驟的源代碼,都存放在我的 Github 上,分別用文件夾 01,02,03 等等來標識。
每一個步驟均是前一步驟的基礎上,添加了若干新特性。建議零基礎或者對 SAP UI5 知之甚少的初學者,按照順序從第一個步驟開始循序漸進地學習,把這些代碼下載到本地,配合教程的文字講解,自己動手,以加深理解。
大家如果對教程的每個步驟有任何疑問,歡迎在教程對應的步驟文章里給我評論,進行留言。
我們回顧一下教程前一個步驟完成后,得到的 SAP UI5 的外觀。
從我的 github 下載教程的完整源代碼到本地,進入 13 這個子文件夾:
使用命令行 npm install 自動安裝依賴后,再使用命令行 ui5 serve 啟動應用:會觀察到 Server started 的提示消息,應用可以通過 http://localhost:8080/webapp/index.html 訪問:
當然,使用 ui5 serve 命令行的前提條件是安裝好 Node.js 運行環境。具體步驟請參考本教程的第四個步驟:SAP UI5 初學者教程之四:XML 視圖初探。
迄今為止的13個步驟,我們都只設計了一個 XML 視圖。在實際項目開發過程中,如果我們把所有的頁面元素都放置到同一個 XML 視圖中,隨著應用頁面復雜度的增加,這個 XML 視圖會越來越龐大,出錯的可能性增加,可維護性下降。
本步驟,我們就來學習,如何把該 XML 視圖的部分元素剝離出來,放到一個新的視圖,即所謂的嵌入視圖中去。
具體步驟參考這篇文章.
總結
以上是生活随笔為你收集整理的SAP UI5 初学者教程之十四 - 嵌入视图的使用方式试读版的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: SAP UI5 初学者教程之十五 - 对
- 下一篇: SAP UI5 应用开发教程之十六 -