使用#ifdef、#ifndef方法适配微信、支付宝、抖音

#ifdef MP-WEIXIN<标识>  标识适配不同端

#ifdef MP-WEIXIN    //适配微信端

<!-- #ifdef MP-WEIXIN -->
      <view class="navigation-bar" :style="{ top: statusTop }">
        <text class="server-title">我的</text>
      </view>
<!-- #endif -->

如果想要自定义导航栏，则需要在pages.json中配置属性transparentTitle设置为auto和navigationStyle设置为custom

"style": {
				"navigationBarTitleText": "客服中心",
				// #ifndef MP-TOUTIAO
				"transparentTitle":"auto",
				"navigationStyle": "custom",
				// #endif
				//支付宝禁止下拉
				"allowsBounceVertical":"NO",
				
				//微信禁止下拉
				"enablePullDownRefresh": false
				// "disableScroll": true
			}

抖音自定义导航栏比较严重，所以需要适配才行，这里使用// #ifndef MP-TOUTIAO即可，其意思就是除抖音之外的

#ifndef是if not define的简写

{
			"path": "pages/my/index",
			"style": {
				"navigationBarTitleText": "我的",
				// #ifndef MP-TOUTIAO
				"transparentTitle":"auto",
				"navigationStyle": "custom",
				// #endif
				//支付宝禁止下拉
				"allowsBounceVertical":"NO",
				
				//微信禁止下拉
				"enablePullDownRefresh": false,
				"disableScroll": true
			}
		},

// #endif 就是结尾标识，相当于闭合标签

完整代码示例

 //适配抖音、头条
<!-- #ifdef MP-TOUTIAO -->
      <div class="header items-center" style="margin-top: 20%;">
 <!-- #endif -->

 //适配微信
<!-- #ifdef MP-WEIXIN -->
      <div class="header items-center" style="margin-top: 20%;">
 <!-- #endif -->

 //适配支付宝
<!-- #ifdef MP-ALIPAY -->
      <div class="header items-center" style="margin-top: 20%;">
 <!-- #endif -->

 //适配除了抖音、头条之外的
<!-- #ifndef MP-TOUTIAO -->
      <div class="header items-center" style="margin-top: 20%;">
 <!-- #endif -->