Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
littlefishear
unidocs-zh
提交
c28e3010
unidocs-zh
项目概览
littlefishear
/
unidocs-zh
与 Fork 源项目一致
Fork自
DCloud / unidocs-zh
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
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.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录