uniapp用的什麼編譯器

Ⅰ uni-app使用Vue.js

說明 ：uni-app基於 Vue 2.0 實現，開發者需注意Vue 1.0 -> 2.0 的使用差異，詳見 從 Vue 1.x 遷移 。

uni-app不僅支持應用生命周期和頁面生命周期，還支持 vue 實例的如下生命周期函數：

注意 ：不要在選項屬性或回調上使用箭頭函數，比如 created: () => console.log(this.a) 或 vm.$watch('a', newValue => this.myMethod())。因為箭頭函數是和父級上下文綁定在一起的，this 不會是如你做預期的 Vue 實例，且 this.a 或 this.myMethod 也會是未定義的。

幾乎全支持 Vue官方文檔：模板語法 ，下面講下不支持的情況。
(1)不支持純HTML
uni-app的非H5端里所有的 BOM／DOM 都不能用，也就是說 v-html 指令不能用，可以使用 rich-text組件 代替。或者使用三方組件wxparse，在hello uni-app中有示例。
(2)不支持部分復雜的 JavaScript 渲染表達式
非H5端無法支持復雜的 JavaScript 表達式。目前可以使用的有 + - * % ?: ! == === > < [] .，剩下的還待完善。
(3)不支持過濾器
編譯到 App 和小程序平台時不支持使用過濾器，可以使用計算屬性（computed）提前計算出數據（如果是數組類型，就提前計算整個數組），用以代替過濾器。
備注 ： 自HBuilderX 1.7.1起，在微信小程序平台支持使用過濾器。

data 必須聲明為返回一個初始數據對象的函數；否則頁面關閉時，數據不會自動銷毀，再次打開該頁面時，會顯示上次數據。

注意 ：在微信小程序端，uni-app 將數據綁定功能委託給Vue，開發者需按Vue 2.0的寫法實現數據綁定，不支持微信小程序的數據綁定寫法，故如下寫法不支持：

需修改為：

支持 Vue官方文檔：計算屬性 。

實現全局變數的方式需要遵循 Vue 單文件模式的開發規范。詳細參考： uni-app全局變數的幾種實現方式 。

非H5端不支持在 template 內使用 methods 中的函數。
備注 ： 自HBuilderX 1.7.1起，在微信小程序平台支持支持在 template 內使用 methods 中的函數。

為節約性能，我們將 Class 與 Style 的表達式通過 compiler 硬編碼到 uni-app 中。

全支持 Vue官方文檔：條件渲染 。

全支持vue列表渲染 Vue官方文檔：列表渲染 。只是需要注意一點，嵌套列表渲染，必須指定不同的索引！需要填寫 :key="xx" 。

注意 ：同級多個 v-for 時 key 的值是不允許重復的，key 的綁定是不支持表達式的，需要按照以下方式處理。

幾乎全支持 Vue官方文檔：事件處理器 。事件映射表如下所示：

注意 ：
(1)事件映射表中沒有的原生事件也可以使用，例如map組件的regionchange 事件直接在組件上寫成 @regionchange,同時這個事件也非常特殊，它的 event type 有 begin 和 end 兩個，導致我們無法在handleProxy 中區分到底是什麼事件，所以你在監聽此類事件的時候同時監聽事件名和事件類型既 <map @regionchange="functionName" @end="functionName" @begin="functionName"><map>。
(2)為兼容各端，事件需使用 v-on 或 @ 的方式綁定，請勿使用小程序端的bind 和 catch 進行事件綁定。
(3)事件修飾符

(4)若需要禁止蒙版下的頁面滾動，可使用 @touchmove.stop.prevent="moveHandle"，moveHandle 可以用來處理 touchmove 的事件，也可以是一個空函數。

(5)按鍵修飾符：uni-app運行在手機端，沒有鍵盤事件，所以不支持按鍵修飾符。

支持 Vue官方文檔：表單控制項綁定 。建議開發過程中直接使用 uni-app：表單組件 。用法示例：
(1)H5 的select 標簽用 picker 組件進行代替

(2)表單元素 radio 用 radio-group 組件進行代替

組件是整個 Vue.js 中最復雜的部分，支持 Vue官方文檔：組件 。有且只能使用單文件組件（.vue 組件）的形式進行支持。其他的諸如：動態組件，自定義 render ，和 <script type="text/x-template"> 字元串模版等非H5端都不支持。詳細的非H5端不支持列表：
(1)暫不支持在組件引用時，在組件上定義 click 等原生事件、v-show（可用 v-if 代替）和 class style 等樣式屬性(例：<card class="class-name"> </card> 樣式是不會生效的)。
Slot（scoped 暫時還沒做支持）
(2)動態組件
(3)非同步組件
(4)inline-template
(5)X-Templates
(6)keep-alive
(7)transition
(8)class
(9)style
(10)組件里使用 slot 嵌套的其他組件時不支持 v-for

uni-app提供了豐富的 UI組件 ，比如： picker , map 等，需要注意的是原生組件上的事件綁定，需要以 vue 的事件綁定語法來綁定，如 bindchange="eventName" 事件，需要寫成 @change="eventName" 。如:

uni-app 支持配置全局組件，需在 main.js 里進行全局注冊，注冊後就可在所有頁面里使用該組件。 注意 ：Vue.component 的第一個參數必須是靜態的字元串。示例：
(1)main.js 里進行全局注冊

(2)index.vue 里可直接使用組件

在 uni-app 中以下這些作為保留關鍵字，不可作為組件名。

備注 ：除以上列表中的名稱外，標準的 HTML 及 SVG 標簽名也不能作為組件名。

(1) 如何獲取上個頁面傳遞的數據
在 onLoad 里得到，onLoad 的參數是其他頁面打開當前頁面所傳遞的數據。
(2) 如何設置全局的數據和全局的方法
uni-app內置了 vuex ，在app里的使用，可參考 hello-uniapp 的 store/index.js 。

(3)如何捕獲 app 的 onError
由於 onError 並不是完整意義的生命周期，所以只提供一個捕獲錯誤的方法，在 app 的根組件上添加名為 onError 的回調函數即可。如下：

(4)組件屬性設置不生效解決辦法
當重復設置某些屬性為相同的值時，不會同步到view層。 例如：每次將scroll-view組件的scroll-top屬性值設置為0，只有第一次能順利返回頂部。 這和props的單向數據流特性有關，組件內部scroll-top的實際值改動後，其綁定的屬性並不會一同變化。解決辦法有兩種（以scroll-view組件為例）：

備注 ：第二種解決方式在某些組件可能造成抖動，推薦第一種解決方式。

Ⅱ 混合開發之uni-app

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

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

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

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

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

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

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

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

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

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

Ⅲ uni-app nvue

nvue 即 native vue，在weex基礎上封裝了uni的api，提供了原生渲染能力，常用於在App端某些vue頁面表現不佳的場景下作為強化補充。
App的nvue頁面使用原生渲染，一個項目中可以同時存在vue和nvue頁面。

HBuilder頁面創建時可以選擇為vue還是nvue頁面
在非app端，只有uni-app編譯模式的nvue文件才會編譯（因weex模式不支持非app端）。
如果一個頁面路由下出現同名的vue和nvue文件，App端會使用nvue頁面，非App端會使用vue頁面。

Ⅳ uniapp開發出來的與專業工具開發出來的有區別嗎

有區別。
uniapp是一個開放的、支持多種開發工具的多端開發框架。HBuilderX和uniapp，同屬一個公司，即DCloud出品。HBuilderX團隊為uniapp做了大量的優化和定製。當然uniapp團隊也為其他開發工具提供了良好的支持，尤其是對vscode，比其他多端框架做的更多。
uniapp是一個使用Vuejs開發所有前端應用的框架，開發者編寫一套代碼，可發布到iOS、Android、Web、以及各種小程序、快應用等多個平台。

Ⅳ uniapp面試題必問有哪些

ni-app面試考試有幾個題是必問的：uni-app收費嗎？跨端會造成功能受限制嗎？以及uni-app的手機端用戶體驗如何？

1、uni-app收費嗎？

uni-app是免費產品，DCloud公司不會向開發者收取任何費用，大家可以放心使用。

DCloud提供的所有開發工具都是免費的，也不會有什麼陷阱。

DCloud的盈利點在幫助開發者進行推廣和流量變現上，而不在開發工具收費上。

2、跨端會造成功能受限制嗎？

uni-app在跨平台的過程中，不犧牲平台特色，不限制平台的能力使用。

應用開發中，80%的常規開發，比如界面組件、聯網等api，uni-app封裝為可跨多端的API。

其餘的，uni-app引入條件編譯。可以優雅的在一個項目里調用不同平台的特色能力。比如push，微信小程序里不支持，但可以在App里使用，還有很多原生sdk，在App時難免涉及，這些都可以正常的在uni-app框架下使用。

3、uni-app的手機端用戶體驗如何？

使用uni-app開發的微信小程序，和直接開發微信小程序相比性能沒有明顯差別，因為uni-app輸出到微信時也是編譯為wxml格式。uni-app編譯到微信使用的是mpvue框架，這個是業內廣泛使用的成熟框架。

uni-app打包成App後的體驗和微信小程序一樣好，在某些場景下更好；微信小程序的Hybrid應用框架是業內體驗上的標桿，實踐證明這種體驗足以承載一線互聯網開發商獲得上億用戶。

uni-app內置預載機制，載入新頁面速度極快，可實現無白屏極速渲染。

uni-app在App端還支持weex原生渲染（nvue），左右拖動長列表等復雜場景依然可實現高流暢性。

Ⅵ uni-app中scss語法初體驗。

1.首先檢測一下你有沒有安裝scss語言，任意一個.vue頁面寫入lang="scss"聲明。

2.如果沒有安裝，會提示如下信息，去插件市場安裝一個就好。

如果你用的是HbuilderX編輯器。

3.依此找到--菜單欄--工具--插件安裝--安裝新插件--前往插件市場安裝--在搜索框輸入scss--點擊安裝

圖片教程：

1.可以嵌套寫css樣式
我們可以測試下：
基本框架：

scss語法體驗：

效果預覽：

uni.scss文件中

以$符號命名一個全局變數名稱。

在其他.vue頁面的樣式中調用這個全局變數名。