2021-05-25

条件注释实现跨端兼容

官网地址：https://uniapp.dcloud.io/platform?id=%e8%b7%a8%e7%ab%af%e5%85%bc%e5%ae%b9

一、条件编译

条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。

写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。

• #ifdef：if defined 仅在某平台存在
• #ifndef：if not defined 除了某平台均存在
• %PLATFORM%：平台名称

• 条件编译写法	说明
  #ifdef APP-PLUS 需条件编译的代码 #endif	仅出现在 App 平台下的代码
  #ifndef H5 需条件编译的代码 #endif	除了 H5 平台，其它平台均存在的代码
  #ifdef H5 || MP-WEIXIN 需条件编译的代码 #endif	在 H5 平台或微信小程序平台存在的代码（这里只有||，不可能出现&&，因为没有交集）

 

<template>
	<view>
				<!-- #ifdef H5 -->
				<view>我希望只在h5</view>
				<!-- #endif -->
				<!-- #ifdef MP-WEIXIN -->
				<view>微信小程序</view>
				<!-- #endif -->
	</view>
    </template>

<script>
	export default {
		data(){
		return {
			imgArr:[]
			}
		},
		methods: {
			
			onload () {
				//#ifdef H5
				 console.log('我希望在h5中')
				 //#endif
				 console.log('我希望在微信')
				 }
			}
	}       
</script>
<style>
	/* h5 */
	/* #ifdef H5 */
	view{
		color: pink;
		}
	 /* #endif */
	/* 微信小程序 */
	/* #ifdef MP-WEIXIN */
    view{
			color: #4CD964;
		}
		/* #endif */
</style>

 二、API的条件编译

// #ifdef %PLATFORM%

平台特有的API实现

// #endif

 示例：以下代码仅在app下出现：