uni-app介紹

uni-app是一個使用 Vue.js 開發(fā)所有前端應用的框架，開發(fā)者編寫一套代碼，可發(fā)布到iOS、Android、H5、以及各種小程序（微信/支付寶/百度/頭條/QQ/釘釘）等多個平臺。

uni-app功能框架

功能框架

Weex/nvue

uni-app App端內置weex渲染引擎，提供原生渲染能力

什么是Weex

Weex 是使用流行的 Web 開發(fā)體驗來開發(fā)高性能原生應用的框架。

然而，Weex并不是一個前端框架。實際上，前端框架僅僅是 Weex 的語法層或稱之為 DSL (Domain-specific Language)，它們與原生渲染引擎是分離的。換句話說，Weex 并不依賴于特定的前端框架，隨著前端技術的發(fā)展，Weex 也可以集成更多廣泛使用的前端框架。

什么是nvue

nvue 相當于給 weex 補充了大量 uni-app 的組件和api，以及豐富的 Plus API、Native.js、原生插件。

以往的 weex ，有個很大的問題是它只是一個高性能的渲染器，沒有足夠的API能力，使得開發(fā)時非常依賴原生工程師協(xié)作，開發(fā)者本來想節(jié)約成本，結果需要前端、iOS、Android 3撥人開發(fā)，適得其反。而 nvue 解決了這個大問題，讓前端工程師可以直接開發(fā)完整 App，并提供原生插件的市場交易和云打包。這些組合方案，開發(fā)者切實的提高效率、降低成本。

如果你是web前端，不熟悉 weex，那么建議你仍然以使用 vue 為主，在App端某些 vue 表現(xiàn)不佳的場景下使用 nvue 作為強化補充：

• 左右拖動的長列表。在webview里，通過swiper+scroll-view實現(xiàn)左右拖動的長列表，前端模擬下拉刷新，這套方案的性能不好。此時推薦使用nvue，比如新建uni-app項目時的新聞示例模板，就是首頁采用了nvue
• 如需要將軟鍵盤右下角按鈕文字改為“發(fā)送”，則需要使用nvue
• 前端控件無法覆蓋原生控件的問題。在nvue下，都是原生控件，覆蓋map、video等不需要cover-view（如需要發(fā)布到小程序，仍然推薦寫cover-view）
• 同樣因為層級問題得到解決，nvue可以實現(xiàn)video內嵌到swiper中，以實現(xiàn)抖音式視頻滑動切換，例子見插件市場；nvue的視頻全屏后，仍然可以通過cover-view實現(xiàn)內容覆蓋，比如增加文字標題、分享按鈕。
• nvue下有l(wèi)ive-pusher組件，和小程序對齊。而vue頁面下使用直播，需在條件編譯里單獨調用plus.video的API。
• App端nvue文件的map和小程序拉齊度更高。vue里的map則與plus.map功能一致，和小程序的地圖略有差異。
• App端實現(xiàn)粘性布局，比如滾動吸頂，則nvue才能保證高性能，例子見插件市場
• 此外，App端，vue頁面上也可以覆蓋subnvue（一種非全屏的nvue頁面覆蓋在webview上），以解決App上的原生控件層級問題。

什么是HTML5+

給瀏覽器賦能，給HTML提供原生api，讓HTML5達到原生水平！如：微信的jsapi，H5+聯(lián)盟等。

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

• 條件編譯調用 HTML5+

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

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

• uni-app 中的事件監(jiān)聽

在普通的 H5+ 項目中，需要使用 document.addEventListener 監(jiān)聽原生擴展的事件。

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

同理，在 uni-app 中使用 Native.js 時，一些 Native.js 中對于原生事件的監(jiān)聽同樣需要按照上面的方法去實現(xiàn)。

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