uniapp使用條件編譯#ifdef(跨平臺設(shè)備兼容)
uni-app 已將常用的組件、JS API 封裝到框架中,開發(fā)者按照 uni-app 規(guī)范開發(fā)即可保證多平臺兼容,大部分業(yè)務(wù)均可直接滿足。
但每個平臺有自己的一些特性,因此會存在一些無法跨平臺的情況。
大量寫 if else,會造成代碼執(zhí)行性能低下和管理混亂。
編譯到不同的工程后二次修改,會讓后續(xù)升級變的很麻煩。
在 C 語言中,通過 #ifdef、#ifndef的方式,為 windows、mac等不同 os 編譯不同的代碼。 uni-app 參考這個思路,為 uni-app 提供了條件編譯手段,在一個工程里優(yōu)雅的完成了平臺個性化實現(xiàn)。
條件編譯
官方文檔:https://uniapp.dcloud.io/platform條件編譯是用特殊的注釋作為標記,在編譯時根據(jù)這些特殊的注釋,將注釋里面的代碼編譯到不同平臺。
常用寫法:
以#ifdef或 #ifndef加%PLATFORM%開頭,以 #endif結(jié)尾。
css樣式
/* #ifdef APP-PLUS */ width: 60upx; height: 60upx; /* #endif */
html標簽
/* #ifdef APP-PLUS */ <button type="default"></button> /* #endif */
js函數(shù)
change() {
// #ifdef APP-PLUS
statusbarHeight = plus.navigator.getStatusbarHeight()
// #endif
}
擴展
#ifdef:if defined 僅在某平臺存在;#ifndef:if not defined 除了某平臺均存在;%PLATFORM%:平臺名稱寫法如下:

支持:
- .vue
- .js
- .css
- pages.json
- 各預(yù)編譯語言文件,如:.scss、.less、.stylus、.ts、.pug
注意:: 條件編譯是利用注釋實現(xiàn)的,在不同語法里注釋寫法不一樣,js使用 // 注釋、css 使用 /* 注釋 */、vue/nvue 模板里使用 ;
以上就是uniapp使用條件編譯#ifdef(跨平臺設(shè)備兼容)的詳細內(nèi)容,更多關(guān)于uniapp使用條件編譯#ifdef(跨平臺設(shè)備兼容)的資料請關(guān)注腳本之家其它相關(guān)文章!
- uniapp使用高德地圖的超詳細步驟
- uniapp實現(xiàn)h5、app與微信小程序三端pdf文件下載和預(yù)覽功能
- uniapp微信小程序打卡功能的詳細實現(xiàn)流程
- 手把手教你寫一個uniapp通用頁面組件
- uniapp頁面間傳參的幾種方法實例總結(jié)
- uniapp開發(fā)打包多端應(yīng)用完整方法指南
- uniapp打包安卓App的兩種方式(云打包、本地打包)方法詳解
- 使用uniapp打包上架微信小程序完整教程
- uniApp微信小程序使用騰訊地圖定位功能及getLocation需要在app.json中聲明permission字段問題解決
- uniapp語音識別(訊飛語音)轉(zhuǎn)文字
相關(guān)文章
vue中el-cascader三級聯(lián)動懶加載回顯問題解決
本文主要介紹了vue中el-cascader三級聯(lián)動懶加載回顯問題解決,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2023-06-06
react+vite動態(tài)導入報錯@vite-ignore的問題及解決
這篇文章主要介紹了react+vite動態(tài)導入報錯@vite-ignore的問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
Nuxt.js SSR與權(quán)限驗證的實現(xiàn)
這篇文章主要介紹了Nuxt.js SSR與權(quán)限驗證的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2018-11-11
手把手搭建安裝基于windows的Vue.js運行環(huán)境
手把手教大家搭建安裝基于windows的Vue.js的運行環(huán)境,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-06-06
使用Vue-neo4j實現(xiàn)繪制三國人物圖譜關(guān)系
這篇文章主要介紹了使用Vue-neo4j實現(xiàn)繪制三國人物圖譜關(guān)系,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-04-04
vue項目使用$router.go(-1)返回時刷新原來的界面操作
這篇文章主要介紹了vue項目使用$router.go(-1)返回時刷新原來的界面操作,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
Vue中的this.$options.data()和this.$data用法說明
這篇文章主要介紹了Vue中的this.$options.data()和this.$data用法說明,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07

