通過最簡單的button控制元件,深入學習SAP UI5框架程式碼系列之零
Jerry曾經作為SAP成都研究院的Fiori應用開發人員,從事了將近3年的SAP CRM Fiori應用開發,在使用SAP UI5的過程中,遇到過形形色色的問題,不少都是通過除錯SAP UI5框架程式碼自行解決的。平時也會有不少朋友向我諮詢開發過程中遇到的和SAP UI5相關的問題,所謂授人以魚不如授人以漁,如果一個SAP UI5開發人員對UI5框架程式碼有些許瞭解,在遇到問題時能夠更有針對性更高效地去定位問題。然而SAP UI5框架程式碼浩如煙海,初學者往往鼓起勇氣想一探究竟,但卻不知道如何下手,最後迷失在UI5的原始碼海洋裡。
Jerry這個系列,通過SAP UI5最簡單的Hello World應用中最簡單的button控制元件出發,試圖向大家展示SAP UI5框架程式碼中圍繞該控制元件的相關實現。雖然使用Fiori Elements,開發人員大多數時候無需手動編寫操作UI5控制元件的JavaScript程式碼,然而在遇到Fiori Elements不能按照自己的期望工作的時候,如果熟悉SAP UI5框架實現,就不至於完全不知所措。
這個系列的英文版在五年之前釋出於SAP社群,收到了很好的反饋,也感謝SAP UI5開發團隊的同事,Andreas Kunz,對我的系列做出了肯定,同時對文章中敘述不完善的地方做出了補充。
雖然五年前Jerry寫作時給予的SAP UI5版本是1.31.0, 五年之後的今天(2020年10月)最新版本已經成為1.82.4, 但是這個系列除了介紹SAP UI5框架實現的部分細節之外,更重要的是向大家展示,Jerry自己是如何通過程式碼除錯的方法,來自學SAP UI5框架程式碼的。
本系列針對SAP UI5框架的所有除錯,都是基於原始碼的Debug Sources版本的,即同時按住"Shift+Alt+Ctrl+P", 在彈出框裡勾上"Use Debug Sources", 重新重新整理應用以載入Debug Sources.
系列目錄
(0) SAP UI5應用開發人員瞭解UI5框架程式碼的意義(本文)
(1) UI5 module懶載入機制
(2) UI5 控制元件渲染機制
(3) HTML原生事件 VS SAP UI5 Semantic事件
(4) UI5控制元件後設資料實現細節
(5) UI5控制元件的例項資料實現細節
(6) UI5控制元件資料繫結的實現原理
(7) UI5控制元件資料繫結的三種模式:One Way,Two Way和OneTime實現原理比較
(8) UI5控制元件ID的生成邏輯
(9) UI5控制元件的多語言(國際化,Internationalization,i18n)支援的實現原理
(10) XML檢視裡的button控制元件
(11) button控制元件和它背後的DOM元素
敬請期待本系列的下一篇文章:UI5 module懶載入機制。希望我不會爛尾。如果大家等不及這個系列的中文版,可以移步SAP社群,直接閱讀我五年前寫的 英文版。
感謝閱讀。
要獲取更多Jerry的原創文章,請關注公眾號"汪子熙":
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2736244/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 深入學習SAP UI5框架程式碼系列之四:SAP UI5控制元件的後設資料實現UI框架控制元件
- 深入學習SAP UI5框架程式碼系列之六:SAP UI5控制元件資料繫結的實現原理UI框架控制元件
- 深入學習SAP UI5框架程式碼系列之五:SAP UI5控制元件的例項資料修改和讀取邏輯UI框架控制元件
- tkinter學習系列(四)之Button 控制元件控制元件
- 深入學習UI5框架程式碼系列之八:談談UI5 的檢視控制元件 ID,以及其和 Angular 檢視的異同UI框架控制元件Angular
- SAP UI5 Web Component裡最簡單的React列表控制元件的用法UIWebReact控制元件
- ajax與json通過程式碼的簡單應用JSON
- 通過 SAP UI5 的 TypeScript 開發環境,來學習什麼是 DefinitelyTypedUITypeScript開發環境
- SAP UI5框架自學教程UI框架
- 27 行程式碼開發一個最簡單的 SAP ALV 報表行程
- SAP UI5自學教程一:button.js的載入邏輯UIJS
- 幽默:“通過128個簡單的步驟學習Kubernetes!” - iamdevloperdev
- 深入介紹 UI5 框架裡 Smart Field 控制元件的工作原理UI框架控制元件
- Python教程系列之Flask框架的學習PythonFlask框架
- 從零開始實現簡單 RPC 框架 6:網路通訊之 NettyRPC框架Netty
- 值得深入學習的控制元件-RecyclerView(原始碼解析篇)控制元件View原始碼
- 無需複雜的數學描述,通過簡單程式碼理解卷積模組卷積
- 從最簡單的入手學習 Docker (一)Docker
- SAP UI5 應用 SimpleForm 控制元件 ResponsiveGridLayout 佈局的工作原理深入剖析UIORM控制元件
- 關於 SAP UI5 Container 控制元件 aggregation 的深入分析試讀版UIAI控制元件
- 最簡單的mybatis自動程式碼生成MyBatis
- 幽默:最簡單的SpringBoot微服務程式碼Spring Boot微服務
- 如何建立最簡單的 SAP Kyma FunctionFunction
- SAP UI5 初學者教程之十一 :SAP UI5 容器類控制元件 Page 和 PanelUI控制元件
- Dubbo原始碼學習之-通過原始碼看看dubbo對netty的使用原始碼Netty
- 2020年總結-用學習過的技術搭建一個簡單的微服務框架 + 原始碼微服務框架原始碼
- SAP UI5 下拉選單(Select) 控制元件的使用方式試讀版UI控制元件
- pytorch深度學習分類程式碼簡單示例PyTorch深度學習
- 學習Linux tar 命令:最簡單也最困難Linux
- 從零開始實現簡單 RPC 框架 5:網路通訊之序列化RPC框架
- elementui原始碼學習之仿寫一個el-buttonUI原始碼
- 如何找到SAP UI5控制元件ID生成的準確時間點和程式碼位置UI控制元件
- salesforce零基礎學習(一百三十三)ListView的button思考SalesforceView
- SAP UI5 初學者教程的學習目錄UI
- Spring5.0原始碼學習系列之Spring AOP簡述Spring原始碼
- 通過 Route 配置的例子,學習SAP Cloud for Customer 的scoping操作Cloud
- SAP UI5 框架的 manifest.jsonUI框架JSON
- SAP UI5 sap.ui.layout.Grid 控制元件概述UI控制元件