魏医生 發表於 2022-1-25 10:59:00

uni-app判断运行的平台

<h3>1，编译期判断(条件编译,代码块中的代码只会编译到对应的发行包里)</h3>
<p>　　①例如：</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> #ifdef H5</span>
    alert(<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">只有h5平台才有alert方法</span><span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> #endif<br></span></pre>
<pre>// #ifndef H5
    alert("除了h5平台之外的其他平台才有的方法")
// #endif</pre>
</div>
<p>　　②//#ifdef&nbsp;<strong>%PLATFORM% //</strong>#endif 可以使用的值</p>
<table style="height: 578px; width: 946px">
<thead>
<tr>
<th>值</th>
<th>生效条件</th>
</tr>
</thead>
<tbody>
<tr>
<td>VUE3</td>
<td>HBuilderX 3.2.0+&nbsp;详情</td>
</tr>
<tr>
<td>APP-PLUS</td>
<td>App</td>
</tr>
<tr>
<td>APP-PLUS-NVUE或APP-NVUE</td>
<td>App nvue</td>
</tr>
<tr>
<td>H5</td>
<td>H5</td>
</tr>
<tr>
<td>MP-WEIXIN</td>
<td>微信小程序</td>
</tr>
<tr>
<td>MP-ALIPAY</td>
<td>支付宝小程序</td>
</tr>
<tr>
<td>MP-BAIDU</td>
<td>百度小程序</td>
</tr>
<tr>
<td>MP-TOUTIAO</td>
<td>字节跳动小程序</td>
</tr>
<tr>
<td>MP-LARK</td>
<td>飞书小程序</td>
</tr>
<tr>
<td>MP-QQ</td>
<td>QQ小程序</td>
</tr>
<tr>
<td>MP-KUAISHOU</td>
<td>快手小程序</td>
</tr>
<tr>
<td>MP-360</td>
<td>360小程序</td>
</tr>
<tr>
<td>MP</td>
<td>微信小程序/支付宝小程序/百度小程序/字节跳动小程序/飞书小程序/QQ小程序/360小程序</td>
</tr>
<tr>
<td>QUICKAPP-WEBVIEW</td>
<td>快应用通用(包含联盟、华为)</td>
</tr>
<tr>
<td>QUICKAPP-WEBVIEW-UNION</td>
<td>快应用联盟</td>
</tr>
<tr>
<td>QUICKAPP-WEBVIEW-HUAWEI</td>
<td>快应用华为</td>
</tr>
</tbody>
</table>
<p>  ③支持的文件</p>
<ul>
<li>.vue/.nvue：&lt;!-- 注释 --&gt;</li>
<li>.js：// 注释</li>
<li>.css：/* 注释 */</li>
<li>pages.json：&nbsp; // 注释</li>
<li>各预编译语言文件，如：.scss、.less、.stylus、.ts、.pug</li>
</ul>
<p>&nbsp;　　④注：<code>VUE3</code>&nbsp;需要在项目的&nbsp;<code>manifest.json</code>&nbsp;文件根节点配置&nbsp;<code>"vueVersion" : "3"</code></p>
<p>　　补充：uni-app static目录的条件编译</p>
<h3>2，运行期判断</h3>
<p>　　可使用&nbsp;<code>uni.getSystemInfoSync().platform</code>&nbsp;判断客户端环境是 Android、iOS 还是小程序开发工具（在百度小程序开发工具、微信小程序开发工具、支付宝小程序开发工具中使用&nbsp;<code>uni.getSystemInfoSync().platform</code>&nbsp;返回值均为 devtools）。</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 128, 1)"> 1</span> <span style="color: rgba(0, 0, 255, 1)">switch</span><span style="color: rgba(0, 0, 0, 1)">(uni.getSystemInfoSync().platform){
</span><span style="color: rgba(0, 128, 128, 1)"> 2</span>   <span style="color: rgba(0, 0, 255, 1)">case</span> <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">android</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">:
</span><span style="color: rgba(0, 128, 128, 1)"> 3</span>      console.log(<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">运行Android上</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 128, 128, 1)"> 4</span>      <span style="color: rgba(0, 0, 255, 1)">break</span><span style="color: rgba(0, 0, 0, 1)">;
</span><span style="color: rgba(0, 128, 128, 1)"> 5</span>   <span style="color: rgba(0, 0, 255, 1)">case</span> <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">ios</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">:
</span><span style="color: rgba(0, 128, 128, 1)"> 6</span>      console.log(<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">运行iOS上</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 128, 128, 1)"> 7</span>      <span style="color: rgba(0, 0, 255, 1)">break</span><span style="color: rgba(0, 0, 0, 1)">;
</span><span style="color: rgba(0, 128, 128, 1)"> 8</span>   <span style="color: rgba(0, 0, 255, 1)">default</span><span style="color: rgba(0, 0, 0, 1)">:
</span><span style="color: rgba(0, 128, 128, 1)"> 9</span>      console.log(<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">运行在开发者工具上</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 128, 128, 1)">10</span>      <span style="color: rgba(0, 0, 255, 1)">break</span><span style="color: rgba(0, 0, 0, 1)">;
</span><span style="color: rgba(0, 128, 128, 1)">11</span> }</pre>
</div>

</div>
<div id="MySignature" role="contentinfo">
    <p>本文来自博客园，作者：꧁执笔小白꧂，转载请注明原文链接：https://www.cnblogs.com/qq2806933146xiaobai/p/15842098.html</p><br><br>
来源：https://www.cnblogs.com/qq2806933146xiaobai/p/15842098.html
頁: [1]
查看完整版本: uni-app判断运行的平台