uniapp中plus的使用


什么是plus?

以plus開頭的方法都是屬於HTML5+環境調用的方法。

plus不能在瀏覽器環境下使用,它必須在手機APP上才能使用,因為以安卓為例,他是操縱webview的API。在5+中,我們在使用plus之前要監聽HTML5+環境是否已經加載完畢,而在uniapp中,則可以直接調用,可以參看uni-app使用plus注意事項。

什么是webview?

WebView是android中一個非常重要的控件,它的作用是用來展示一個web頁面。它使用的內核是webkit引擎,4.4版本之后,直接使用chrome作為內置網頁瀏覽器。它的作用是顯示和渲染頁面,可與頁面JavaScript加護,實現混合開發。

什么是HTML5+?

HTML5+是中國HTML5產業聯盟的擴展規范,基於HTML5擴展了大量調用設備的能力,使得web語言可以像原生語言一樣強大。

 

uni-app App 端內置 HTML5+ 引擎,讓 js 可以直接調用豐富的原生能力。

條件編譯調用 HTML5+

小程序及 H5 等平台是沒有 HTML5+ 擴展規范的,因此在 uni-app 調用 HTML5+ 的擴展規范時,需要注意使用條件編譯。否則運行到h5、小程序等平台會出現 plus is not defined錯誤。

// #ifdef APP-PLUS
var appid = plus.runtime.appid;
console.log('應用的 appid 為:' + appid);
// #endif

 

uni-app不需要 plus ready

在html中使用plus的api,需要等待plus ready。 而uni-app不需要等,可以直接使用。而且如果你調用plus ready,反而不會觸發。

uni-app 中的事件監聽

在普通的 H5+ 項目中,需要使用 document.addEventListener 監聽原生擴展的事件。

uni-app 中,沒有 document。可以使用 plus.globalEvent.addEventListener 來實現(注意manifest中需開啟新編譯器,即自定義組件模式"usingComponents":true)。

// #ifdef APP-PLUS
// 監聽設備網絡狀態變化事件
plus.globalEvent.addEventListener('netchange', function(){});
// #endif

 

同理,在 uni-app 中使用 Native.js 時,一些 Native.js 中對於原生事件的監聽同樣需要按照上面的方法去實現。

注意:舊編譯器(非自定義組件模式)不支持 plus.globalEvent 這個對象。

跨端兼容

uni-app 已將常用的組件、JS API 封裝到框架中,開發者按照 uni-app 規范開發即可保證多平台兼容,大部分業務均可直接滿足。

但每個平台有自己的一些特性,因此會存在一些無法跨平台的情況。

  • 大量寫 if else,會造成代碼執行性能低下和管理混亂。
  • 編譯到不同的工程后二次修改,會讓后續升級變的很麻煩。

在 C 語言中,通過 #ifdef、#ifndef 的方式,為 windows、mac 等不同 os 編譯不同的代碼。 uni-app 參考這個思路,為 uni-app 提供了條件編譯手段,在一個工程里優雅的完成了平台個性化實現。

條件編譯

條件編譯是用特殊的注釋作為標記,在編譯時根據這些特殊的注釋,將注釋里面的代碼編譯到不同平台。

寫法:以 #ifdef 或 #ifndef 加 %PLATFORM% 開頭,以 #endif 結尾。

  • #ifdef:if defined 僅在某平台存在
  • #ifndef:if not defined 除了某平台均存在
  • %PLATFORM%:平台名稱
條件編譯寫法 說明
#ifdef APP-PLUS
需條件編譯的代碼
#endif
僅出現在 App 平台下的代碼
#ifndef H5
需條件編譯的代碼
#endif
除了 H5 平台,其它平台均存在的代碼
#ifdef H5 || MP-WEIXIN
需條件編譯的代碼
#endif
在 H5 平台或微信小程序平台存在的代碼(這里只有||,不可能出現&&,因為沒有交集)

%PLATFORM% 可取值如下:

 

平台
APP-PLUS App
APP-PLUS-NVUE或APP-NVUE App nvue
H5 H5
MP-WEIXIN 微信小程序
MP-ALIPAY 支付寶小程序
MP-BAIDU 百度小程序
MP-TOUTIAO 字節跳動小程序
MP-QQ QQ小程序
MP-360 360小程序
MP 微信小程序/支付寶小程序/百度小程序/字節跳動小程序/QQ小程序/360小程序
QUICKAPP-WEBVIEW 快應用通用(包含聯盟、華為)
QUICKAPP-WEBVIEW-UNION 快應用聯盟
QUICKAPP-WEBVIEW-HUAWEI 快應用華為

 

注意

  • Android 和 iOS 平台不支持通過條件編譯來區分,如果需要區分 Android、iOS 平台,請通過調用 uni.getSystemInfo 來獲取平台信息。支持ifiosifAndroid代碼塊,可方便編寫判斷。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM