Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
unidocs-zh
提交
64c7f561
unidocs-zh
项目概览
DCloud
/
unidocs-zh
通知
3277
Star
107
Fork
831
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
99
列表
看板
标记
里程碑
合并请求
76
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
99
Issue
99
列表
看板
标记
里程碑
合并请求
76
合并请求
76
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
64c7f561
编写于
1年前
作者:
W
wanganxp
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
补充开发注意
上级
05549f48
master
auto-translate
dev
docs/merge-docs
feat-renderjs
fix-title_By_HRK
无相关合并请求
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
150 addition
and
34 deletion
+150
-34
docs/uni-app-x/_sidebar.md
docs/uni-app-x/_sidebar.md
+1
-0
docs/uni-app-x/codegap.md
docs/uni-app-x/codegap.md
+124
-0
docs/uni-app-x/readme.md
docs/uni-app-x/readme.md
+6
-18
docs/uts/data-type.md
docs/uts/data-type.md
+19
-16
未找到文件。
docs/uni-app-x/_sidebar.md
浏览文件 @
64c7f561
*
[
概述
](
README.md
)
*
[
开发注意
](
codegap.md
)
*
[
性能
](
performance.md
)
*
[
编译器
](
compiler/README.md
)
*
CSS
...
...
This diff is collapsed.
Click to expand it.
docs/uni-app-x/codegap.md
0 → 100644
浏览文件 @
64c7f561
# uni-app x 开发注意
与web开发相比,uni-app x最大的变化有2个:
-
弱类型的js改为了强类型的uts
-
不再使用webview渲染,导致css有变化
重视,并把握好这两点,就可以很快上手。
## 类型系统注意
强类型语言中,变量、方法、参数、返回值、data数据,都必须有类型。
基础类型包括:boolean|string|number|Array|Date|UTSJSONObject|any|null...
开发者需阅读
[
uts
](
https://uniapp.dcloud.net.cn/uts/
)
文档,了解类型的定义和使用。
如下代码比较典型的说明了uni-app x中uts类型的要求。
可以看出template和css的代码和以前的uni-app相同,但script区域有变化。
不管是data、自定义变量,甚至是组件事件参数(TouchEvent),都必须有类型。
有的没有通过
`:`
定义类型,其实是因为编译器具备一定的自动推导能力,可以帮开发者自动补类型。
data里
`:`
的用途是赋值,无法通过
`:`
定义类型,所以data的数据有2种处理方式:1、通过字面量自动推导;2、通过
`as`
声明
```
html
<template>
<view
@
touchstart=
"touchstart"
>
<text
class=
"red"
>
{{s1}}
</text>
</view>
<button
@
click=
"buttonClick"
:disabled=
"buttonEnable"
>
按钮
</button>
</template>
<script
lang=
"uts"
>
type
User
=
{
name
:
string
}
export
default
{
data
()
{
const
date
=
new
Date
()
//自动推导类型为Date
const
v
=
1
;
return
{
s1
:
"
hello
"
,
// 根据字面量推导为string
n1
:
0
as
number
,
// 这里其实可以根据字面量自动推导,as number写不写都行
n2
,
// 不合法,必须指定类型。真实运行时请删掉本行
n3
as
number
,
// 不合法,uts不支持undefined,必须初始化。真实运行时请删掉本行
n4
:
null
as
number
|
null
// 合法。定义为可为null的数字,初始值是null,但在使用n4前必须为其赋值数字
year
:
date
.
getFullYear
()
as
number
,
// 在data里,目前无法通过变量类型推导data项的类型,需使用 as 显式声明
buttonEnable
:
false
,
t
:
``
,
// 模板字面量,推导为 string
o
:
{
id
:
1
,
name
:
"
DCloud
"
},
// 对象字面量,推导为 UTSJSONObject,注意:访问 data 中定义的UTSJSONObject属性时,需要使用索引访问,如 this.o["id"]
an
:
[
1
,
2
],
// 数组字面量,如果元素均为纯数字字面量,则推导为 Array
<
number
>
as
:
[
'
1
'
,
'
2
'
,
`3`
],
// 数组字面量,如果元素均为纯字符串或模板字符串字面量,则推导为 Array
<
string
>
ab
:
[
true
,
false
],
// 数组字面量,如果元素均为boolean字面量,则推导为 Array
<
boolean
>
ao
:
[{
id
:
1
},
{
id
:
2
}],
// 数组字面量,如果元素均为对象字面量,则推导为 Array
<
UTSJSONObject
>
am
:
[[
1
,
2
],
[
2
,
3
],
[
3
,
4
]],
// 数组字面量,支持嵌套推导,推导为 Array
<
Array
<
number
>>
aa
:
[
1
,
'
2
'
],
// 数组字面量,如果元素类型不一致,则推导为 Array
<
any
|
null
>
u
:
{
name
:
'
DCloud
'
}
as
User
,
// 类型断言,如果主动指定了类型,则不做自动推导,使用指定的类型,注意:自定义type,需要定义在 export default 外部或通过其他文件导入
au
:
[{
name
:
'
DCloud
'
}]
as
User
[],
// 类型断言,支持数组类型断言
v
:
v
,
// 非字面量类型,目前未指定类型断言,推导为 any | null,建议此情况,均通过as手动指定类型
}
}
methods
:
{
touchstart
(
e
:
TouchEvent
)
{
// e必须有类型
let
sX
:
number
=
e
.
touches
[
0
].
screenX
;
let
sY
:
number
=
e
.
touches
[
0
].
screenY
;
},
buttonClick
:
function
()
{
this
.
buttonEnable
=
true
this
.
s1
=
"
点过按钮了
"
},
}
}
</script>
<style>
.red
{
color
:
red
}
</style>
```
## 函数 event 参数需显式指定类型
```
html
<view
@
click=
"(e: any) => foo(e)"
>
event must has type
</view>
<view
@
click=
"foo($event as MouseEvent)"
>
event must has type
</view>
```
## JSON的类型注意
JSON在强类型语言中使用时,不能像js那样随意。这部分内容较长,
[
详见
](
../uts/data-type.md#JSON
)
## 作用域插槽数据类型
作用域插槽需在组件中指定插槽数据类型
```
ts
// components/Foo.uvue
<
view
>
<
slot
name
=
"
test name
"
/>
<
/view
>
import
{
SlotsType
}
from
'
vue
'
export
default
{
slots
:
Object
as
SlotsType
<
{
default
:
{
name
:
string
}
}
>
}
// page.uvue
<
view
>
<
Foo
>
<
template
v
-
slot
=
"
slotProps
"
>
<
text
>
{{
slotProps
.
name
}}
<
/text
>
<
/template
>
<
/Foo
>
<
/view>
```
## uts不支持undefined
任何变量被定义后,都需要赋值。
## css使用注意
[
详见
](
css/readme.md
)
\ No newline at end of file
This diff is collapsed.
Click to expand it.
docs/uni-app-x/readme.md
浏览文件 @
64c7f561
...
...
@@ -130,23 +130,6 @@ uni-app x 一期,只包括基本的组件和API。
-
form
-
label
需要注意:uts作为强类型语言,组件的事件参数,也必须有类型。这和js不同。例如:
```
html
<template>
<view
@
touchstart=
"touchstart"
></view>
<script
lang=
"ts"
>
export
default
{
methods
:
{
touchstart
(
e
:
TouchEvent
)
{
// e必须有类型
sX
=
e
.
touches
[
0
].
screenX
;
sY
=
e
.
touches
[
0
].
screenY
;
}
}
}
</script>
```
详细的组件事件类型清单,
[
详见
](
)
## 4. uni的API
...
...
@@ -233,7 +216,12 @@ uni自带API,如下为目前支持的清单。
### 性能
*
[x] uni.getPerformance
## 5. 插件兼容
## 5. 全局文件
-
manifest.json 仅支持基本的名称图标配置,暂未支持splash
-
AndroidManifest.xml 与原生开发相同
-
pages.json 不支持app-plus的内容
## 6. 插件兼容
插件市场的uts插件,不管是API插件还是组件,均可同时在 uni-app js引擎版 和 uni-app x 上运行。
...
...
This diff is collapsed.
Click to expand it.
docs/uts/data-type.md
浏览文件 @
64c7f561
...
...
@@ -61,9 +61,9 @@ let d = 3.14159 //注意:目前版本推导d为float类型,新版本
|Long |64bit |-9223372036854775808 |9223372036854775807 |整型|
|ULong |64bit |0 |9223372036854775807
*
2 + 1 |整型|
|Float |32bit |1.4E-45F |3.4028235E38 |
[
浮点型
](
https://kotlinlang.org/docs/numbers.html#floating-point-types
)
|
|Double |64bit |4.9E-324 |
1.7976931348623157E308 |
[
浮点型
](
https://kotlinlang.org/docs/numbers.html#floating-point-types
)
|
|Double |64bit |4.9E-324 |1.7976931348623157E308 |
[
浮点型
](
https://kotlinlang.org/docs/numbers.html#floating-point-types
)
|
基本数据类型会有jvm编译魔法加持,kotlin 会把
Int / Double 等非空类型编译为 基本数据类型,Int? / Double? 等可为空的类型编译为 Integer等包装类型,享受不到编译优化加持。
基本数据类型会有jvm编译魔法加持,kotlin 会把 Int / Double 等非空类型编译为 基本数据类型,Int? / Double? 等可为空的类型编译为 Integer等包装类型,享受不到编译优化加持。
如果涉及大量运算,建议开发者不要使用 number、Int? ,要明确使用 Int等类型
[
详情
](
https://kotlinlang.org/docs/numbers.html#numbers-representation-on-the-jvm
)
...
...
@@ -268,8 +268,11 @@ let str5 = nstr3 as string // 类型为string
日期对象表示日期,包括年月日时分秒等各种日期。
它的类型名称是首字母大写
`:Date`
。但通过new Date()赋值时,可以省略
`:Date`
。
```
ts
const
myDate
=
new
Date
()
const
myDate
=
new
Date
()
// 通过new Date赋值时,可以省略:Date
const
myDate1
:
Date
=
new
Date
()
console
.
log
(
myDate
instanceof
Date
)
// Date用typeof会返回object,需使用instanceof判断
const
year
:
number
=
myDate
.
getFullYear
()
```
...
...
@@ -307,23 +310,23 @@ let a2 = [1,'2',3];//支持
let
a3
=
[
1
,,
2
,
3
];
//不支持
```
2.
创建数组对象
2.
使用:Array
<>
定义数组项的类型
```
ts
let
a1
=
new
Array
(
1
,
2
,
3
);
//支持
let
a2
=
new
Array
(
1
,
'
2
'
,
3
);
//支持
let
a3
=
Array
(
1
,
2
,
3
);
//支持
let
a4
=
Array
(
1
,
'
2
'
,
'
3
'
);
//支持
const
a1
:
Array
<
string
>
=
[
"
uni-app
"
,
"
uniCloud
"
,
"
HBuilder
"
]
//表示数组内容都是string。如不能确定可以写Array<any>
```
3.
使用[]定义数组项的类型
```
ts
const
a1
:
string
[]
=
[
'
a
'
,
'
b
'
,
'
c
'
];
const
a1
:
string
[]
=
[
'
a
'
,
'
b
'
,
'
c
'
];
//表示数组内容都是string
```
4.
使用Array
<>
定义数组项的类型
4.
创建数组对象
```
ts
const
a1
:
Array
<
string
>
=
[
"
uni-app
"
,
"
uniCloud
"
,
"
HBuilder
"
]
let
a1
=
new
Array
(
1
,
2
,
3
);
//支持
let
a2
=
new
Array
(
1
,
'
2
'
,
3
);
//支持
let
a3
=
Array
(
1
,
2
,
3
);
//支持
let
a4
=
Array
(
1
,
'
2
'
,
'
3
'
);
//支持
```
字面量创建的数组,在uts的老版本上,kotlin自动推导数组类型,可能会推导成intArray,而不是uts的array。建议显式声明类型。
...
...
@@ -689,7 +692,7 @@ let rect = {
这种写法比较简单,和js习惯一致,但在 UTS 中限制较多。它的使用有如下前提:
-
通过type声明了对象的数据结构,也就是需要单独定义一个type再使用。详见type章节。这也是大多数强类型使用对象字面量初始化的方式。
-
如未定义type,则仅限于web和Android,在iOS上
,swift不
不支持
`.`
操作符。在Android上也只支持字面量定义json。如果是
`JSON.parse()`
转换的,则不能使用。
-
如未定义type,则仅限于web和Android,在iOS上
swift
不支持
`.`
操作符。在Android上也只支持字面量定义json。如果是
`JSON.parse()`
转换的,则不能使用。
2.
[""]下标属性
即
`rect["x"]`
。
...
...
@@ -737,7 +740,7 @@ console.log(listData["count"]); //42
console
.
log
(
listArr
[
0
][
"
title
"
]);
//第一组
```
多层级下标访问
是
需要使用 as 转换为 UTSJSONObject
多层级下标访问
时
需要使用 as 转换为 UTSJSONObject
```
ts
var
j
=
{
"
test
"
:{
"
a-b
"
:
1
...
...
@@ -794,7 +797,7 @@ console.log(utsObj.getString("age"))
在所有的getXXX函数中
`getAny`
是一个特殊的存在,它可以获取属性,而不要求限制类型,他的返回值是 any 类型。
需要注意的是
在
强类型语言中使用 any 是一件危险的事情,如果你需要使用
`getAny`
请确保你已经充分了解了可能遇到的问题。
需要注意的是
在
强类型语言中使用 any 是一件危险的事情,如果你需要使用
`getAny`
请确保你已经充分了解了可能遇到的问题。
```
ts
// 如果我们不确定属性类型,可以使用`getAny`来进行获取
...
...
@@ -814,7 +817,7 @@ let detailInfoObj = utsObj["detailInfo"] as UTSJSONObject
let
street
=
utsObj
[
"
street
"
]
as
String
```
上面的写法,啰嗦且容易出错。因此,我们提供了更
高级
的 keypath 写法,帮助开发者摆脱复杂的对象嵌套关系:
上面的写法,啰嗦且容易出错。因此,我们提供了更
易用
的 keypath 写法,帮助开发者摆脱复杂的对象嵌套关系:
```
ts
// 结果:the wall street
let
street
=
utsObj
.
getString
(
"
address.detailInfo.street
"
)
...
...
This diff is collapsed.
Click to expand it.
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录
新手
引导
客服
返回
顶部