這個 `_onLoadListener` 函式什麼時候註冊的呢？

![](https://img-blog.csdnimg.cn/img_convert/b6ddb5d4a4a2350dff936b73ef52eb83.png)

iframe 完成載入之後，就觸發這個 load 事件註冊的處理函式：
![](https://img-blog.csdnimg.cn/img_convert/616361ee6edac78dd71d5be7c375a97b.png)

```javascript
PDFViewer.prototype.onAfterRendering = function () {
			var fnInitIframeElement = function () {
				// cant use attachBrowserEvent because it attach event to component root node (this.$())
				// load event does not bubble so it has to be bind directly to iframe element
				var oIframeElement = this._getIframeDOMElement();

oIframeElement.on("load", this._onLoadListener.bind(this));
				oIframeElement.on("error", this._onErrorListener.bind(this));
```
load 事件：
![](https://img-blog.csdnimg.cn/img_convert/cf6ff0ba9343fe8005a40b3b5b0cbc6b.png)

`application/pdf` 是支援的 mime type：
![](https://img-blog.csdnimg.cn/img_convert/b1ac34941b73df63664c71e01fc6622e.png)

判斷瀏覽器是否支援直接檢視 pdf 檔案的方法：
![](https://img-blog.csdnimg.cn/img_convert/9b261b0773e833c86f1e2902244a57b8.png)

![](https://img-blog.csdnimg.cn/img_convert/d1596e1949a4b7f0377f07fd6c7363b7.png)

點了 loading errors 之後，bContinue 標誌位為 false，因為此時 `oTarget[0].contentWindow.document.embeds` 為空：

![](https://img-blog.csdnimg.cn/img_convert/ad25c10aa955e1fe0322ae0ea7d51bc2.png)

所以進入此處的 else 分支：
![](https://img-blog.csdnimg.cn/img_convert/0deefd191f14b36c381f71a5b7b5edfe.png)

在 `PDFViewer.prototype._renderErrorState` 裡，把下載按鈕設定為 disabled:
![](https://img-blog.csdnimg.cn/img_convert/47e91feb1c5172748d0e9f65dfa6f0ce.png)

在函式 `PDFViewerRenderer.renderPdfContent` 裡：
![](https://img-blog.csdnimg.cn/img_convert/94c7e9eca5040f816d6a72efc462f4ba.png)

進入 else 分支。

拿到 ErrorPlaceHolder：
![](https://img-blog.csdnimg.cn/img_convert/bd7fc66d3f838016e316570b24ad190e.png)

讀取的是 null：
![](https://img-blog.csdnimg.cn/img_convert/3eafd7a0875fbb851d7fa5e5b18542af.png)

這個屬性是從哪裡讀取的呢？
![](https://img-blog.csdnimg.cn/img_convert/d6503d1b79d8400841def896dca3d683.png)

![](https://img-blog.csdnimg.cn/img_convert/d42d97d844ac4adb42b549c499bbbec4.png)

從這個 `https://sapui5.hana.ondemand.com/resources/sap/m/messagebundle_en_US.properties` 檔案裡讀取。

在這個方法裡讀取：
![](https://img-blog.csdnimg.cn/img_convert/1d5e82ad66b1ae387f6f9c94228b93dd.png)

```javascript
this.renderErrorContent(oRm, oControl);
```

這個方法的名稱是動態植入的：`getPlaceholderMessagePageControl`

![](https://img-blog.csdnimg.cn/img_convert/34574c34cd38cd6a0a2d9714744fa6a3.png)

當 PDF 檢視器嵌入到 sap.m.IconTabBar 控制元件中時，切換選項卡時可能無法重新載入 PDF 文件。 要解決此問題，可以執行以下任一操作：

- 當使用者在選項卡之間切換時，將 PDF 檢視器的可見性設定為 false。

- 每次使用者導航到不同的選項卡時，從 DOM 中刪除 PDF 檢視器 iframe 元素。 可以透過呼叫 `sap.m.PDFViewer#invalidate` 方法刪除 PDF 檢視器元素。

使用者可用的輔助功能可能會有所不同，具體取決於安裝的 Adobe Acrobat Reader 版本。

該控制元件支援的幾種 displayType：`sap.m.PDFViewerDisplayType`

- 如果設定為 `link`，PDF 檢視器將顯示為帶有下載按鈕的工具欄，可用於下載 PDF 檔案。

- 當呼叫 `#open` 方法時，使用者可以在新選項卡中開啟 PDF 檔案或下載它。

- 如果設定為`嵌入式(embedded)`，PDF 檢視器將嵌入父容器中，並顯示 PDF 文件或由 errorPlaceholderMessage 屬性定義的訊息。

- 如果設定為 `auto`，PDF 檢視器的外觀取決於所使用的裝置：

(1) 在移動裝置（手機、平板電腦）上，PDF 檢視器顯示為帶有下載按鈕的工具欄。

(2) 在桌面裝置上，PDF 檢視器嵌入在其父容器中。

SAP UI5 載入本地並不存在的 PDF 檔案的錯誤處理

相關文章