uni-app快速入門教程


1、什么是uni-app?

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

即使不跨端,uni-app同時也是更好的小程序開發框架。

 

2、uni-app適用於哪些人員?

所有的前端開發人員,尤其是app和小程序開發人員。

有vue和微信小程序基礎的人員,能快速上手uni-app。

不推薦無前端基礎的直接學。

 

3、uni-app的開發工具

毫無疑問,首選uni-app官方推薦工具:https://www.dcloud.io/hbuilderx.html

 

4、uni-app首選學習通道

毋庸置疑,首選uni-app官方文檔:https://uniapp.dcloud.io

熟悉微信小程序文檔的可以直接跨越性閱讀。

 

5、快速創建一個uni-app項目

安裝好HBuilder-x工具后,打開界面,新建項目--->選擇uni-app

 

 

 

 6、大概目錄介紹,運行方式可以直接閱讀工具的中文菜單欄或看文檔。

┌─components            uni-app組件目錄
│  └─comp-a.vue         可復用的a組件
├─hybrid                存放本地網頁的目錄,詳見
├─platforms             存放各平台專用頁面的目錄,詳見
├─pages                 業務頁面文件存放的目錄
│  ├─index
│  │  └─index.vue       index頁面
│  └─list
│     └─list.vue        list頁面
├─static                存放應用引用靜態資源(如圖片、視頻等)的目錄,注意:靜態資源只能存放於此
├─wxcomponents          存放小程序組件的目錄,詳見
├─main.js               Vue初始化入口文件
├─App.vue               應用配置,用來配置App全局樣式以及監聽 應用生命周期
├─manifest.json         配置應用名稱、appid、logo、版本等打包信息,詳見
└─pages.json            配置頁面路由、導航條、選項卡等頁面類信息,詳見

  

 

 

 

 

學習重點:閱讀文檔,實在不理解的先去學習vue微信小程序

 


免責聲明!

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



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