uniappの条件付きコンパイルには2つの方法がありますか? ミニプログラムとH5の代表値は何ですか?

UniApp では、条件付きコンパイルを使用して、さまざまなプラットフォーム (ミニ プログラム、H5 など) に応じてさまざまなコード処理を実行できます。条件付きコンパイルを実装するには、主に属性と条件付きアノテーションを使用する 2 つの方法がありますmp。以下にこれら 2 つの方法とミニプログラムと H5 端末の代表値を紹介します。

1. 使用mp属性:

   Vue 単一ファイル コンポーネントでは、mpプロパティを使用して、現在アプレット環境にいるかどうかを確認できます。ミニ プログラム環境では、mp属性は に設定されます'wx'が、H5 またはその他の環境では、属性は になりますundefined。この機能を利用して、条件付きコンパイルを実装できます。

   例

   <template>
     <view>
       <!-- 这段代码仅在小程序端可见 -->
       <text v-if="$mp.platform === 'wx'">这是小程序环境</text>
       <!-- 这段代码在所有平台都可见 -->
       <text>这是通用内容</text>
     </view>
   </template>
   

    

2. 条件付きコメントを使用します。

   HTML の条件付きコメントと同様に、UniApp はプラットフォームに従ってコードを記述するための条件付きコメントもサポートしています。条件付きアノテーションを使用すると、より詳細な条件付きコンパイルを実現できます。

   例：

   <template>
     <view>
       <!-- #ifdef MP-WEIXIN -->
       <text>这是小程序端</text>
       <!-- #endif -->
   
       <!-- #ifdef H5 -->
       <text>这是 H5 端</text>
       <!-- #endif -->
     </view>
   </template>
   

    

ミニプログラムとH5端子の代表値は以下の通りです。

• WeChat ミニ プログラム:MP-WEIXIN
• Alipay ミニプログラム:MP-ALIPAY
• 百度ミニプログラム:MP-BAIDU
• H5側：H5
• アプリ側:APP-PLUS

必要に応じて、条件付きコンパイルでこれらの代表値を使用して、異なるプラットフォームに異なるコードを作成できます。条件付きコンパイルは主に、異なるプラットフォームでのプラットフォームの違いに対処するために使用されますが、条件付きコンパイルが多すぎるとコードの保守が困難になる可能性があるため、使用する場合は慎重に検討してください。