SAP中使用SAP UI5的獨特之處是什么

本篇內容介紹了“SAP中使用SAP UI5的獨特之處是什么”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

下面就以Account這個工作中心視圖頁面為例來看。

首先，我們知道在UI Designer里面畫好了頁面后，會生成對應的XML文件存儲在ABAP后臺。同時，我們在UI Designer里面也可以看到生成的XML文件：

我們可以看到上圖紅色區域標注的標簽EmbeddedComponents，里面的targetComponentID指向一個Object Work List(OWL)。這個OWL也就是我們在Account工作視圖上看到的OWL, 如下圖。

那么在運行時這些XML文件是如何被渲染出來的呢?

運行時有一個JavaScript對象來打開窗口，該對象的實現位于文件MWindowManager.js。我們在這里打斷點可以看出_open方法觸發了整個頁面的渲染。當我們點擊Account工作中心視圖的時候，會把視圖所在路徑傳入此方法。

進入后續的處理邏輯，這里會根據resource path（也就是之前提到的視圖所在地址）去向后臺發送一個請求，取回一個JSON model，然后執行回調函數。

接下來我們去看回調里面做了什么。

觀察從后臺返回的HTTP響應，發現是一個JSON模型，包含了這個頁面具體的組件信息。這里就可以跟前面我們看到的XML對應上了。接著程序會去取這些組件的render manager，并執行render（渲染）操作。

我的同事，SAP成都研究院小李探花周帥，在他的文章淺談Fiori Design Guidelines里曾經提到，C4C有三套UI，Silverlight，HTML5和RUI。其中HTML5和RUI都基于SAP UI5。那么什么時候去渲染HTML5的控件，什么時候又去渲染RUI的控件呢？實際上每一個UI控件都有其對應的renderer，那具體是哪一個render來負責生成HTML5源代碼，就是由下面getRendererName里面的邏輯來取出對應的renderer。

比如下圖是正在渲染RUI端的Tool Bar:

比如下圖所示正在渲染HTML5頁面上的紅框區域：

然而并不是所有的C4C UI都是通過UI Designer開發而成。C4C仍然存在部分UI5傳統的XML視圖。

以Visit工作中心為示例，選擇某個survey打開:

打開的Survey明細頁面卻是通過UI5 XML視圖實現的：

那么問題來了，UI Designer開發的視圖里包含的超鏈接，如何能夠指向一個UI5 XML視圖？

首先找到這個超鏈接點擊的OnClick處理函數OnSurveyPreview：

OnSurveyPreview的處理有三個分支，這不難理解。因為前面說過C4C有三套UI，SilverLight，HTML5和RUI。盡管這三套UI共享同一個UI Designer的開發視圖，然而點擊超鏈接后的跳轉邏輯略微有差異，因此在OnClick處理函數OnSurveyPreview里分三個分支處理。下圖中間紅色區域的分支代碼在RUI里點擊超鏈接的跳轉實現。

點擊上圖中間的紅色分支，發現RUI的超鏈接點擊跳轉實現的函數為：OnOpenResponsiveSurvey

該函數最后會打開一個CustomControl：

這個CustomControl的路徑，即對應JavaScript的實現，維護在UI Designer里：

在運行時，該Custom Control的JavaScript實現會使用JavaScript代碼創建XML視圖實例，如下圖第127行，XML視圖的構造函數被調用，

這就是為什么點了超鏈接之后，從Chrome開發者工具里能看到main.view.xml文件的加載：

“SAP中使用SAP UI5的獨特之處是什么”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！