Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
unidocs-zh
提交
c28e3010
unidocs-zh
项目概览
DCloud
/
unidocs-zh
通知
3221
Star
106
Fork
818
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
95
列表
看板
标记
里程碑
合并请求
71
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
95
Issue
95
列表
看板
标记
里程碑
合并请求
71
合并请求
71
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
c28e3010
编写于
9月 07, 2023
作者:
W
wanganxp
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
x
上级
05769472
变更
8
隐藏空白更改
内联
并排
Showing
8 changed file
with
43 addition
and
29 deletion
+43
-29
docs/collocation/main.md
docs/collocation/main.md
+4
-4
docs/tutorial/platform.md
docs/tutorial/platform.md
+18
-15
docs/uni-app-x/_sidebar.md
docs/uni-app-x/_sidebar.md
+2
-1
docs/uni-app-x/api.md
docs/uni-app-x/api.md
+4
-4
docs/uni-app-x/compiler/README.md
docs/uni-app-x/compiler/README.md
+2
-0
docs/uni-app-x/component/common.md
docs/uni-app-x/component/common.md
+2
-0
docs/uni-app-x/component/image.md
docs/uni-app-x/component/image.md
+10
-4
docs/uts/_sidebar.md
docs/uts/_sidebar.md
+1
-1
未找到文件。
docs/collocation/main.md
浏览文件 @
c28e3010
...
...
@@ -55,16 +55,16 @@ export function createApp() {
## 代码时序
开发者写的代码,在应用启动时,按如下时序加载:
1.
main.js/uts 的
`export function createApp() {}`
外的代码、任何页面的script中
`export default {}`
外的代码
1.
main.js/uts 的
`export function createApp() {}`
外的代码、任何页面
/组件
的script中
`export default {}`
外的代码
2.
main.js/uts 的
`export function createApp() {}`
中的代码
3.
app.vue/uvue中onLaunch的代码
4.
首页的onLoad
5.
首页的onReady
开发者需谨慎在main.js/uts、页面script中
`export default {}`
外、和onLaunch中编写代码:
1.
这些的代码都会影响启动速度
开发者需谨慎在main.js/uts、页面
/组件
script中
`export default {}`
外、和onLaunch中编写代码:
1.
这些的代码都会影响启动速度
(定义type不会,type是使用时才加载)
2.
执行太早,很多功能和API无法使用,需trycatch。尤其是与界面相关的都无法使用,此时首页都还没有创建。
3.
main.js/uts、页面script中
`export default {}`
外的代码,其创建的变量在应用存活时一直占据着内存
。
3.
main.js/uts、页面script中
`export default {}`
外的代码,其创建的变量在应用存活时一直占据着内存
,不会跟随页面关闭而回收
## 插件
...
...
docs/tutorial/platform.md
浏览文件 @
c28e3010
## 跨端兼容
uni-app 已将常用的组件、
JS API
封装到框架中,开发者按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。
uni-app 已将常用的组件、
API
封装到框架中,开发者按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。
但每个平台有自己的一些特性,因此会存在一些无法跨平台的情况。
-
大量写 if else,会造成代码执行性能低下和管理混乱。
-
编译到不同的工程后二次修改,会让后续升级变的很麻烦。
-
为每个平台重写,明明主业务逻辑又一样
在 C 语言中,通过 #ifdef、#ifndef 的方式,为 windows、mac 等不同 os 编译不同的代码。
``uni-app``
参考这个思路,为
``uni-app``
提供了条件编译手段,在一个工程里优雅的完成了平台个性化实现。
...
...
@@ -14,27 +15,28 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。
**写法:**
以
<span
style=
"color:#859900;"
>
#ifdef
</span>
或
<span
style=
"color:#859900;"
>
#ifndef
</span>
加
<b
style=
"color:#268BD2"
>
%PLATFORM%
</b>
开头,以
<span
style=
"color:#859900;"
>
#endif
</span>
结尾。
*
<span
style=
"color:#859900;"
>
#ifdef
</span>
:if defined 仅在某平台存在
*
<span
style=
"color:#859900;"
>
#ifndef
</span>
:if not defined 除了某平台均存在
*
<b
style=
"color:#268BD2"
>
%PLATFORM%
</b>
:平台名称
**写法:**
以
`#ifdef`
或
`#ifndef`
加
`%PLATFORM%`
开头,以
`#endif`
结尾。
*
`#ifdef`
:if defined 仅在某平台存在
*
`#ifndef`
:if not defined 除了某平台均存在
*
`%PLATFORM%`
:平台名称
<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 平台,其它平台均存在的代码
(注意if后面有个n)
</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>
<b
style=
"color:#268BD2"
>
%PLATFORM%
</b>
**可取值如下:**
|值|生效条件|
说明
|
|值|生效条件|
版本支持
|
|:-|:-|:-|
|VUE3|
[
详情
](
https://ask.dcloud.net.cn/article/37834
)
(uni-app js引擎版)|HBuilderX 3.2.0+|
|VUE3|uni-app js引擎版用于区分vue2和3,
[
详情
](
https://ask.dcloud.net.cn/article/37834
)
|HBuilderX 3.2.0+|
|UNI-APP-X|用于区分是否是uni-app x项目
[
详情
](
#UNI-APP-X
)
|HBuilderX 3.9.0+|
|APP|App||
|APP-PLUS|
App(uni-app js引擎版)
||
|APP-PLUS|
uni-app js引擎版编译为App时
||
|APP-PLUS-NVUE或APP-NVUE|App nvue 页面||
|APP-ANDROID|App Android 平台 仅限 uts文件||
|APP-IOS|App iOS 平台 仅限 uts文件||
|UNI-APP-X|uni-app x项目
[
详情
](
#UNI-APP-X
)
|HBuilderX 3.9.0+|
|H5|H5(推荐使用
`WEB`
)||
|WEB|
H5
|HBuilderX 3.6.3+|
|WEB|
web
|HBuilderX 3.6.3+|
|MP-WEIXIN|微信小程序||
|MP-ALIPAY|支付宝小程序||
|MP-BAIDU|百度小程序||
...
...
@@ -51,17 +53,18 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
**支持的文件**
*
.vue
*
.js
*
.vue
/.nvue/.uvue
*
.js
/.uts
*
.css
*
pages.json
*
各预编译语言文件,如:.scss、.less、.stylus、.ts、.pug
**注意:**
*
条件编译是利用注释实现的,在不同语法里注释写法不一样,js
使用
``// 注释``
、css 使用
``/* 注释 */``
、vue/n
vue 模板里使用
``<!-- 注释 -->``
;
*
条件编译是利用注释实现的,在不同语法里注释写法不一样,js
/uts使用
``// 注释``
、css 使用
``/* 注释 */``
、vue/nvue/u
vue 模板里使用
``<!-- 注释 -->``
;
*
条件编译APP-PLUS包含APP-NVUE和APP-VUE,APP-PLUS-NVUE和APP-NVUE没什么区别,为了简写后面出了APP-NVUE ;
*
使用条件编译请保证
`编译前`
和
`编译后`
文件的语法正确性,即要保障无论条件编译是否生效都能通过语法校验。比如:json文件中不能有多余的逗号,js中不能重复导入;
*
对于未定义平台名称,可能是名称写错了,也可能是低版本HBuilderX还不认识这个平台。此时的条件编译,
`#ifdef`
中的代码不会生效,而
`#ifndef`
中的代码会生效;
::: preview
...
...
@@ -123,7 +126,7 @@ uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-
:::
*
`VUE3`
需要在项目的
`manifest.json`
文件根节点配置
`"vueVersion" : "3"`
;
*
对于未定义平台名称的条件编译,
`#ifdef`
中的代码不会生效,而
`#ifndef`
中的代码会生效;
<pre
v-pre=
""
data-lang=
"javascript"
>
<code
class=
"lang-javascript code"
><span
class=
"token comment"
>
//
<span
style=
"color:#859900;"
>
#ifdef
</span><b
style=
"color:#268BD2"
>
%PLATFORM%
</b></span>
...
...
docs/uni-app-x/_sidebar.md
浏览文件 @
c28e3010
...
...
@@ -3,7 +3,7 @@
*
[
与js开发的差别
](
tutorial/codegap.md
)
*
[
request联网教程
](
tutorial/request.md
)
*
[
全局变量与状态管理
](
tutorial/store.md
)
*
编译器
*
[编译器]
*
[
概述
](
compiler/README.md
)
*
[
条件编译
](
/tutorial/platform.md
)
*
全局文件
...
...
@@ -42,6 +42,7 @@
*
[
web-view
](
component/web-view.md
)
*
[
animation-view
](
component/animation-view.md
)
*
API
*
[
概述
](
api.md
)
*
基础
*
[
getApp
](
api/getApp.md
)
*
[
getCurrentPages
](
api/getCurrentPages.md
)
...
...
docs/uni-app-x/api.md
浏览文件 @
c28e3010
...
...
@@ -4,7 +4,7 @@ uni-app x支持的API包括:
-
uts的api
[
详见
](
/uts/buildin-object-api/global.md
)
-
uni.xxx的内置api。见左侧
-
uniCloud.xxx的内置api。见左侧
由于uts可以直接调用Android和iOS的API,所以os和三方sdk的能力都可以在uts中调用。
一般原生能力建议封装为
[
uni_modules
](
/plugin/uni_modules.md
)
\ No newline at end of file
-
Dom的api
[
详见
](
dom/README.md
)
-
原生API
*
由于uts可以直接调用Android和iOS的API,所以os和三方sdk的能力都可以在uts中调用。
*
一般原生能力建议封装为
[
uni_modules
](
/plugin/uni_modules.md
)
形式的
[
uts插件
](
/plugin/uts-plugin.md
)
。
\ No newline at end of file
docs/uni-app-x/compiler/README.md
浏览文件 @
c28e3010
...
...
@@ -8,6 +8,8 @@ uvue编译器是在Vite基础上进行扩展开发的。
它的大部分特性(如条件编译)和配置项(如环境变量)与
`uni-app`
的vue3编译器一致,
[
详见
](
https://uniapp.dcloud.net.cn/tutorial/compiler.html
)
支持less、sass、scss等css预编译。
#### 编译缓存 @cache
`uni-app x`
编译器引入了编译缓存机制,以优化开发体验。
...
...
docs/uni-app-x/component/common.md
浏览文件 @
c28e3010
...
...
@@ -20,6 +20,8 @@
-
@click //与tap等价
-
@longpress
在多点触摸的屏幕上,touch事件返回数组,包含了每个touch点对应的x、y坐标。
### 冒泡事件系统
DOM事件主要有三个阶段:捕获阶段、目标阶段和冒泡阶段。
...
...
docs/uni-app-x/component/image.md
浏览文件 @
c28e3010
...
...
@@ -18,21 +18,27 @@
### src路径支持说明
-
本地路径/static方式
由于uni-app编译时,只把/static目录下的静态资源copy到app中,所以src均需指向/static目录下。
其他目录的图片由于不会被打包进去,所以无法访问。本地路径的大小写不敏感。
-
本地绝对路径file:///方式
形如
`file:///storage/emulated/0/Android/data/io.dcloud.uniappx/apps/__UNI__4517034/www/static/test-image/logo.png`
。
访问本应用内的资源时无需使用本方式,推荐使用/static方式。上述地址受包名、appid影响。
file:///方式一般用于download等公共目录。使用前需确保拥有相关权限。
-
支持网络路径
支持http、https。
image组件内部使用facebook的fresco库,自带缓存策略,也会自动清理缓存。
image组件内部使用facebook的
[
fresco
](
https://github.com/facebook/fresco
)
库(2.5.0),自带缓存策略,也会自动清理缓存。
<!-- UTSCOMJSON.image.compatibility -->
#### App平台
-
App-Android平台image组件使用Fresco图片库实现:
[
com.facebook.fresco:fresco:2.5.0
](
https://github.com/facebook/fresco
)
### tips
在error事件里监听报错,并重新设置image组件的src,可实现自定义错误图。
[
详见示例代码
](
https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/image/image-path.uvue
)
...
...
docs/uts/_sidebar.md
浏览文件 @
c28e3010
...
...
@@ -26,7 +26,7 @@
*
[
Console
](
buildin-object-api/console.md
)
*
[
全局
](
buildin-object-api/global.md
)
*
[
关键词
](
keywords.md
)
*
[
学习资料
](
learning.md
)
<!-- * [学习资料](learning.md) -->
*
uts插件
*
[
uts插件开发入门
](
/plugin/uts-plugin.md
)
*
[
uts页面组件开发入门
](
/plugin/uts-component.md
)
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录