diff --git a/docs/envs.md b/docs/envs.md index 2dc3f2b7dc1f..1b74a8683eba 100644 --- a/docs/envs.md +++ b/docs/envs.md @@ -71,6 +71,38 @@ if (TARO_ENV === 'weapp') { ::: +### 组件文件中跨平台支持 + +为了方便大家书写样式跨端的组件代码,目前在.vue文件template模板内容中支持条件编译的特性。 + +指定平台保留样式: + +```vue +/* #ifdef %PLATFORM% */ +模板代码 +/* #endif */ +``` + +指定平台剔除样式: + +```vue +/* #ifndef %PLATFORM% */ +模板代码 +/* #endif */ +``` + +其中 `PLATFORM` 的取值与 `process.env.TARO_ENV` 保持一致 + +例如,希望某段模板内容只在 **微信小程序中** 生效,可以如下写法 + +```vue +/* #ifdef weapp */ +模板代码 +/* #endif */ +``` + +如果是多个平台,之间可以使用空格隔开。 + ## 统一接口的多端文件 内置环境变量虽然可以解决大部分跨端的问题,但是会让代码中充斥着逻辑判断的代码,影响代码的可维护性,而且也让代码变得愈发丑陋。为了解决这种问题,Taro 提供了另外一种跨端开发的方式作为补充。 diff --git a/versioned_docs/version-3.x/envs.md b/versioned_docs/version-3.x/envs.md index 2dc3f2b7dc1f..1b74a8683eba 100644 --- a/versioned_docs/version-3.x/envs.md +++ b/versioned_docs/version-3.x/envs.md @@ -71,6 +71,38 @@ if (TARO_ENV === 'weapp') { ::: +### 组件文件中跨平台支持 + +为了方便大家书写样式跨端的组件代码,目前在.vue文件template模板内容中支持条件编译的特性。 + +指定平台保留样式: + +```vue +/* #ifdef %PLATFORM% */ +模板代码 +/* #endif */ +``` + +指定平台剔除样式: + +```vue +/* #ifndef %PLATFORM% */ +模板代码 +/* #endif */ +``` + +其中 `PLATFORM` 的取值与 `process.env.TARO_ENV` 保持一致 + +例如,希望某段模板内容只在 **微信小程序中** 生效,可以如下写法 + +```vue +/* #ifdef weapp */ +模板代码 +/* #endif */ +``` + +如果是多个平台,之间可以使用空格隔开。 + ## 统一接口的多端文件 内置环境变量虽然可以解决大部分跨端的问题,但是会让代码中充斥着逻辑判断的代码,影响代码的可维护性,而且也让代码变得愈发丑陋。为了解决这种问题,Taro 提供了另外一种跨端开发的方式作为补充。