Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Bing_GoGo
unidocs-zh
提交
db1d3603
U
unidocs-zh
项目概览
Bing_GoGo
/
unidocs-zh
与 Fork 源项目一致
Fork自
DCloud / unidocs-zh
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
db1d3603
编写于
8月 26, 2021
作者:
Q
qiang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
docs: platform.md remove mp
上级
500486ac
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
60 addition
and
22 deletion
+60
-22
docs/platform.md
docs/platform.md
+60
-22
未找到文件。
docs/platform.md
浏览文件 @
db1d3603
...
...
@@ -19,7 +19,58 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
*
<span
style=
"color:#859900;"
>
#ifndef
</span>
:if not defined 除了某平台均存在
*
<b
style=
"color:#268BD2"
>
%PLATFORM%
</b>
:平台名称
<table><thead><tr><th>
条件编译写法
</th><th>
说明
</th></tr></thead><tbody><tr><td><div
class=
"code"
><span
class=
"token comment"
><span
style=
"color:#859900;"
>
#ifdef
</span><b
style=
"color:#268BD2"
>
APP-PLUS
</b></span><br>
需条件编译的代码
<br><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span></div></td><td>
仅出现在 App 平台下的代码
</td></tr><tr><td><div
class=
"code"
><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#ifndef
</span><b
style=
"color:#268BD2"
>
H5
</b></span><br>
需条件编译的代码
<br><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span></div></td><td>
除了 H5 平台,其它平台均存在的代码
</td></tr><tr><td><div
class=
"code"
><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#ifdef
</span><b
style=
"color:#268BD2"
>
H5
</b></span><span
style=
"color:#859900;"
>
||
</span><b
style=
"color:#268BD2"
>
MP-WEIXIN
</b><br>
需条件编译的代码
<br><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span></div></td><td>
在 H5 平台或微信小程序平台存在的代码(这里只有||,不可能出现&&,因为没有交集)
</td></tr></tbody></table>
<table>
<thead>
<tr>
<th>
条件编译写法
</th>
<th>
说明
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div
class=
"code"
>
<span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#ifdef
</span>
<b
style=
"color:#268BD2"
>
APP-PLUS
</b>
</span>
<br>
需条件编译的代码
<br>
<span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span>
</div>
</td>
<td>
仅出现在 App 平台下的代码
</td>
</tr>
<tr>
<td>
<div
class=
"code"
>
<span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#ifndef
</span>
<b
style=
"color:#268BD2"
>
H5
</b>
</span>
<br>
需条件编译的代码
<br>
<span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span>
</div>
</td>
<td>
除了 H5 平台,其它平台均存在的代码
</td>
</tr>
<tr>
<td>
<div
class=
"code"
>
<span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#ifdef
</span>
<b
style=
"color:#268BD2"
>
H5
</b>
</span>
<span
style=
"color:#859900;"
>
||
</span>
<b
style=
"color:#268BD2"
>
APP-PLUS
</b>
<br>
需条件编译的代码
<br><span
class=
"token comment"
>
<span
style=
"color:#859900;"
>
#endif
</span></span>
</div>
</td>
<td>
在 H5 平台或 App 平台存在的代码(这里只有||,不可能出现&&,因为没有交集)
</td>
</tr>
</tbody>
</table>
<b
style=
"color:#268BD2"
>
%PLATFORM%
</b>
**可取值如下:**
...
...
@@ -30,17 +81,6 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
|APP-PLUS|App|
|APP-PLUS-NVUE或APP-NVUE|App nvue|
|H5|H5|
|MP-WEIXIN|微信小程序|
|MP-ALIPAY|支付宝小程序|
|MP-BAIDU|百度小程序|
|MP-TOUTIAO|字节跳动小程序|
|MP-QQ|QQ小程序|
|MP-KUAISHOU|快手小程序|
|MP-360|360小程序|
|MP|微信小程序/支付宝小程序/百度小程序/字节跳动小程序/QQ小程序/360小程序|
|QUICKAPP-WEBVIEW|快应用通用(包含联盟、华为)|
|QUICKAPP-WEBVIEW-UNION|快应用联盟|
|QUICKAPP-WEBVIEW-HUAWEI|快应用华为|
**支持的文件**
...
...
@@ -83,15 +123,13 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
平台特有的组件
<span
class=
"token comment"
>
<
!--
<span
style=
"color:#859900;"
>
#endif
</span>
--
>
</span></code></pre>
示例,如下
公众号关注组件仅会在微信小程序
中出现:
示例,如下
组件仅会在App
中出现:
````
html
<view>
<view>
微信公众号关注组件
</view>
<view>
<!-- uni-app未封装,但可直接使用微信原生的official-account组件-->
<!-- #ifdef MP-WEIXIN -->
<official-account></official-account>
<!-- #ifdef APP-PLUS -->
<my-test></my-test>
<!-- #endif -->
</view>
</view>
...
...
@@ -117,7 +155,7 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
![](
https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/04ecec40-4f3c-11eb-97b7-0dc4655d6e68.png
)
不同平台下的特有功能,
以及小程序平台的分包,
都可以通过 pages.json 的条件编译来更好地实现。这样,就不会在其它平台产生多余的资源,进而减小包体积。
不同平台下的特有功能,都可以通过 pages.json 的条件编译来更好地实现。这样,就不会在其它平台产生多余的资源,进而减小包体积。
json的条件编译,如不同平台的key名称相同,cli项目下开发者自己安装的校验器会报错,需自行关闭这些校验器对json相同key的校验规则。如果使用HBuilderX的校验器,无需在意此问题,HBuilderX的语法校验器为此优化过。
...
...
@@ -125,12 +163,12 @@ json的条件编译,如不同平台的key名称相同,cli项目下开发者
在不同平台,引用的静态资源可能也存在差异,通过 static 的的条件编译可以解决此问题,static 目录下新建不同平台的专有目录(目录名称同
`%PLATFORM%`
值域,但字母均为小写),专有目录下的静态资源只有在特定平台才会编译进去。
如以下目录结构,
``a.png``
只有在
微信小程序
平台才会编译进去,
``b.png``
在所有平台都会被编译。
如以下目录结构,
``a.png``
只有在
App
平台才会编译进去,
``b.png``
在所有平台都会被编译。
<pre
v-pre=
""
data-lang=
""
>
<code
class=
"lang-"
style=
"padding:0"
>
┌─static
│ ├─
mp-weixin
│ ├─
app-plus
│ │ └─a.png
│ └─b.png
├─main.js
...
...
@@ -142,7 +180,7 @@ json的条件编译,如不同平台的key名称相同,cli项目下开发者
### 整体目录条件编译
如果想把各平台的页面文件更彻底的分开,也可以在uni-app项目根目录创建
`platforms`
目录,然后在下面进一步创建
`app-plus`
、
`mp-weixin`
等子目录,存放不同平台的文件。
如果想把各平台的页面文件更彻底的分开,也可以在uni-app项目根目录创建
`platforms`
目录,然后在下面进一步创建
`app-plus`
等子目录,存放不同平台的文件。
**注意**
...
...
@@ -179,5 +217,5 @@ HBuilderX 为 ``uni-app`` 的条件编译提供了丰富的支持:
### 注意
*
Android 和 iOS 平台不支持通过条件编译来区分,如果需要区分 Android、iOS 平台,请通过调用 uni.getSystemInfo 来获取平台信息。支持
`ifios`
、
`ifAndroid`
代码块,可方便编写判断。
*
有些跨端工具可以提供js的条件编译或多态,但这对于实际开发远远不够。uni-app不止是处理js,任何代码都可以多端条件编译,才能真正解决实际项目的跨端问题。另外所谓多态在实际开发中会造成大量冗余代码,很不利于复用和维护。
举例,微信小程序主题色是绿色,而百度支付宝小程序是蓝色,你的应用想分平台适配颜色,只有条件编译是代码量最低、最容易维护的。
*
有些跨端工具可以提供js的条件编译或多态,但这对于实际开发远远不够。uni-app不止是处理js,任何代码都可以多端条件编译,才能真正解决实际项目的跨端问题。另外所谓多态在实际开发中会造成大量冗余代码,很不利于复用和维护。
*
有些公司的产品运营总是给不同平台提不同需求,但这不是拒绝uni-app的理由。关键在于项目里,复用的代码多还是个性的代码多,正常都是复用的代码多,所以仍然应该多端。而个性的代码放到不同平台的目录下,差异化维护。
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录