1啄寡、項(xiàng)目目錄結(jié)構(gòu)

一個(gè)uni-app工程怨规，默認(rèn)包含如下目錄及文件：

┌─uniCloud              云空間目錄俭茧，阿里云為uniCloud-aliyun,騰訊云為uniCloud-tcb（詳見(jiàn)uniCloud）
│─components            符合vue組件規(guī)范的uni-app組件目錄
│  └─comp-a.vue         可復(fù)用的a組件
├─hybrid                App端存放本地html文件的目錄
├─platforms             存放各平臺(tái)專用頁(yè)面的目錄
├─pages                 業(yè)務(wù)頁(yè)面文件存放的目錄
│  ├─index
│  │  └─index.vue       index頁(yè)面
│  └─list
│     └─list.vue        list頁(yè)面
├─static                存放應(yīng)用引用的本地靜態(tài)資源（如圖片、視頻等）的目錄，注意：靜態(tài)資源只能存放于此
├─uni_modules           存放[uni_module](/uni_modules)規(guī)范的插件篮昧。
├─wxcomponents          存放小程序組件的目錄
├─main.js               Vue初始化入口文件
├─App.vue               應(yīng)用配置赋荆，用來(lái)配置App全局樣式以及監(jiān)聽(tīng) 應(yīng)用生命周期
├─manifest.json         配置應(yīng)用名稱、appid懊昨、logo窄潭、版本等打包信息
└─pages.json            配置頁(yè)面路由、導(dǎo)航條酵颁、選項(xiàng)卡等頁(yè)面類信息

2嫉你、應(yīng)用生命周期

uni-app 支持如下應(yīng)用生命周期函數(shù)：

注意

• 應(yīng)用生命周期僅可在App.vue中監(jiān)聽(tīng)幽污，在其它頁(yè)面監(jiān)聽(tīng)無(wú)效。

3其掂、頁(yè)面生命周期

uni-app 支持如下頁(yè)面生命周期函數(shù)：

4雳灾、組件生命周期

自定義組件時(shí)漠酿，組件的生命周期

注：掛載階段紊选，先渲染組件啼止，然后掛載組件。

想要在拿到在props中定義的屬性值時(shí)做一些操作兵罢，可以在mounted回調(diào)中處理

5献烦、開(kāi)發(fā)環(huán)境和生產(chǎn)環(huán)境的判斷

HBuilderX 中敲入代碼塊 uEnvDev、uEnvProd 可以快速生成對(duì)應(yīng) development卖词、production 的運(yùn)行環(huán)境判定代碼巩那。

// uEnvDev
if (process.env.NODE_ENV === 'development') {
    // TODO 開(kāi)發(fā)環(huán)境
}
// uEnvProd
if (process.env.NODE_ENV === 'production') {
    // TODO 生產(chǎn)環(huán)境
}

6吏夯、運(yùn)行平臺(tái)判斷

運(yùn)行期判斷 運(yùn)行期判斷是指代碼已經(jīng)打入包中，仍然需要在運(yùn)行期判斷平臺(tái)即横，此時(shí)可使用 uni.getSystemInfoSync().platform 判斷客戶端環(huán)境是 Android噪生、iOS 還是小程序開(kāi)發(fā)工具（在百度小程序開(kāi)發(fā)工具、微信小程序開(kāi)發(fā)工具东囚、支付寶小程序開(kāi)發(fā)工具中使用 uni.getSystemInfoSync().platform 返回值均為 devtools）跺嗽。

switch(uni.getSystemInfoSync().platform){
    case 'android':
       console.log('運(yùn)行Android上')
       break;
    case 'ios':
       console.log('運(yùn)行iOS上')
       break;
    default:
       console.log('運(yùn)行在開(kāi)發(fā)者工具上')
       break;
}

7、條件編譯

寫法：以 #ifdef 或 #ifndef 加 %PLATFORM% 開(kāi)頭页藻，以 #endif 結(jié)尾桨嫁。

• #ifdef：if defined 僅在某平臺(tái)存在
• #ifndef：if not defined 除了某平臺(tái)均存在
• %PLATFORM%：平臺(tái)名稱

%PLATFORM% 可取值如下：

支持的文件

• .vue
• .js
• .css
• pages.json
• 各預(yù)編譯語(yǔ)言文件废境，如：.scss畜挨、.less、.stylus噩凹、.ts巴元、.pug

注意：

• 條件編譯是利用注釋實(shí)現(xiàn)的，在不同語(yǔ)法里注釋寫法不一樣驮宴，js使用 // 注釋务冕、css 使用 /* 注釋 */、vue/nvue 模板里使用<幻赚！-- 注釋 -->；
• 條件編譯APP-PLUS包含APP-NVUE和APP-VUE臊旭，APP-PLUS-NVUE和APP-NVUE沒(méi)什么區(qū)別落恼，為了簡(jiǎn)寫后面出了APP-NVUE ；
• 使用條件編譯請(qǐng)保證編譯前和編譯后文件的正確性离熏，比如json文件中不能有多余的逗號(hào)佳谦；