vue和uni-app的差別有什麼

vue和uni-app的差別：1、uni-app可以透過打包實現一套程式碼多端運行，而vue不行；2、uni-app有自動的框架預載，載入頁面的速度更快，vue沒有；3、uniapp使用小程式的標籤，vue使用web端的標籤；4、uni不支援vue-router，使用自帶的路由。

本教學操作環境：windows7系統、uni-app2.5.1&&vue2.9.6版本、Dell G3電腦。

uniapp和vue的區別

uni-app可以編譯到（頭條，支付寶，微信，QQ，百度）小程序，安卓版，ios版，h5版。透過打包實現一套程式碼多端運行；vue在web上是為單頁應用而生的，在app上，單頁應用程式會卡死。

uni-app還有自動的框架預載，載入頁面的速度更快。

元件/標籤的變化

以前是html標籤，現在是小程式標籤。

• p 改成view
• span、font 改成text
• a 改成navigator
• img 改成image
• input 還在，但type屬性改成了confirmtype
• form、button、checkbox、radio、label、textarea、canvas、video
  這些還在。
• select 改成picker
• iframe 改成web-view
• ul、li沒有了，都用view取代
• audio 不再推薦使用，改成api方式，背景音訊api文檔
  其實舊的HTML標籤也可以在uni-app裡使用，uni-app編譯器會在編譯時把老標籤轉為新標籤，例如把p編譯成view。但不推薦這種用法，調試H5端時容易混亂。

除了改動外，新增了一批手機端常用的新元件

• scroll-view 可區域捲動視圖容器

• swiper 可滑動區域視圖容器

• #icon 圖示

##rich-text富文本（不可執行js，但可渲染各種文字格式和圖片）

progress 進度條

##slider 滑桿指示器

switch 開關選擇器

camera 相機

live-player 直播

map 地圖

cover-view 可覆寫原生元件的視圖容器

cover-view需要多強調幾句，uni-app的非h5端的video、map、canvas、textarea是原生元件，層級高於其他元件。如需覆蓋原生元件，例如在map上加個遮罩，則需要使用cover-view元件

除了內建元件，還有很多開源的擴充元件，把常用操作都進行封裝，DCloud建立了外掛程式市集收錄這些擴充元件，詳見外掛程式市場

Js

#因為uni-app的api是參考小程式的，所以和瀏覽器的js api有很多不同，如

alert,confirm 改成uni.showmodel

1. ajax axios 改成uni.request
2. cookie、session 沒有了，local .storage 改成uni.storage
3. vue-router沒有了，改成了uni.navigateTo

uni-app的js api還有很多，但基本上就是小程式的api，把wx.request改為uni.request即可。

uni-app在不同的端，支援條件編譯，無限制的使用各端獨有的api，

uniapp自帶路由與請求方式

uni.navigateTo 路由與頁面跳轉

uni.request 網路請求

相關推薦：《

vue.js教學

》、《uniapp教學》

以上是vue和uni-app的差別有什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章！