uniapp条件编译
uni-app 将已经将可以跨平台兼容处理的组件及 API 等进行了封装,但是部分平台的特性无法跨平台。
由此,uni-app 提供了条件编译的方案,来处理不同平台的特定或差异。
写法
- #ifdef: 仅在某平台存在
- #ifndef: 除了某平台均存在
onLoad() { // 仅出现在App平台下的代码 // #ifdef APP-PLUS console.log('条件编译下的代码1') // #endif // 除了APP平台,其他平台均执行 // #ifndef APP-PLUS console.log('条件编译下的代码2') // #endif // 仅在APP和H5平台执行该代码,没有&&因为只有一个平台存在 // #ifdef APP-PLUS || H5 console.log('条件编译下的代码3') // #endif }
下面是具体使用实例
在h5上运行
// #ifdef H5 console.log('H5代码执行') // #endif
在App平台上运行
// #ifdef APP-PLUS console.log('App平台下代码执行') // #endif
微信小程序代码执行
// #ifdef MP-WEIXIN console.log('微信小程序代码执行') // #endif // 除了MP-WEIXIN微信小程序还有支付宝、百度、字节跳动 //、飞书、QQ、快手、360总共八种小程序 // 支付宝小程序 // #ifdef MP-ALIPAY console.log('支付宝小程序代码执行') // #endif // 百度小程序 // #ifdef MP-BAIDU console.log('百度小程序代码执行') // #endif // 字节跳动小程序 // #ifdef MP-TOUTIAO console.log('字节跳动小程序代码执行') // #endif // 飞书小程序 // #ifdef MP-LARK console.log('飞书小程序代码执行') // #endif // QQ小程序 // #ifdef MP-QQ console.log('QQ小程序代码执行') // #endif // 快手小程序 // #ifdef MP-KUAISHOU console.log('快手小程序代码执行') // #endif // 360小程序 // #ifdef MP-360 console.log('360小程序代码执行') // #endif
小程序平台下执行
// #ifdef MP console.log('小程序平台下代码执行') // #endif
App nvue 页面执行
// #ifdef APP-PLUS-NVUE console.log('APP-NVUE页面代码执行') // #endif // #ifdef APP-NVUE console.log('APP-NVUE页面代码执行') // #endif
快应用通用(包含联盟、华为)代码执行
// #ifdef QUICKAPP-WEBVIEW console.log('快应用通用(包含联盟、华为)代码执行') // #endif
快应用华为
// 快应用华为 // #ifdef console.log('QUICKAPP-WEBVIEW-HUAWEI') // #endif