uniapp使用條件編譯#ifdef(跨平臺設備兼容)
uni-app 已將常用的組件、JS API 封裝到框架中,開發(fā)者按照 uni-app 規(guī)范開發(fā)即可保證多平臺兼容,大部分業(yè)務均可直接滿足。
但每個平臺有自己的一些特性,因此會存在一些無法跨平臺的情況。
大量寫 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
- 各預編譯語言文件,如:.scss、.less、.stylus、.ts、.pug
注意
:: 條件編譯是利用注釋實現(xiàn)的,在不同語法里注釋寫法不一樣,js使用 // 注釋、css 使用 /* 注釋 */、vue/nvue 模板里使用 ;
以上就是uniapp使用條件編譯#ifdef(跨平臺設備兼容)的詳細內(nèi)容,更多關(guān)于uniapp使用條件編譯#ifdef(跨平臺設備兼容)的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
vue中el-cascader三級聯(lián)動懶加載回顯問題解決
本文主要介紹了vue中el-cascader三級聯(lián)動懶加載回顯問題解決,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2023-06-06react+vite動態(tài)導入報錯@vite-ignore的問題及解決
這篇文章主要介紹了react+vite動態(tài)導入報錯@vite-ignore的問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03Nuxt.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-04vue項目使用$router.go(-1)返回時刷新原來的界面操作
這篇文章主要介紹了vue項目使用$router.go(-1)返回時刷新原來的界面操作,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07Vue中的this.$options.data()和this.$data用法說明
這篇文章主要介紹了Vue中的this.$options.data()和this.$data用法說明,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07