Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
enjoyphenix
unidocs-zh
提交
f74b266b
unidocs-zh
项目概览
enjoyphenix
/
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,发现更多精彩内容 >>
提交
f74b266b
编写于
9月 06, 2023
作者:
W
wanganxp
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
x
上级
fcba9fad
变更
11
隐藏空白更改
内联
并排
Showing
11 changed file
with
157 addition
and
567 deletion
+157
-567
docs/uni-app-x/_sidebar.md
docs/uni-app-x/_sidebar.md
+9
-1
docs/uni-app-x/api.md
docs/uni-app-x/api.md
+7
-501
docs/uni-app-x/api/getLocation.md
docs/uni-app-x/api/getLocation.md
+10
-0
docs/uni-app-x/api/getSystemInfo.md
docs/uni-app-x/api/getSystemInfo.md
+12
-0
docs/uni-app-x/css/font-family.md
docs/uni-app-x/css/font-family.md
+6
-1
docs/uni-app-x/css/readme.md
docs/uni-app-x/css/readme.md
+3
-0
docs/uni-app-x/readme.md
docs/uni-app-x/readme.md
+16
-7
docs/uni-app-x/tutorial/request.md
docs/uni-app-x/tutorial/request.md
+46
-44
docs/uni-app-x/tutorial/store.md
docs/uni-app-x/tutorial/store.md
+15
-9
docs/uni-app-x/vue/readme.md
docs/uni-app-x/vue/readme.md
+15
-0
docs/uts/data-type.md
docs/uts/data-type.md
+18
-4
未找到文件。
docs/uni-app-x/_sidebar.md
浏览文件 @
f74b266b
...
...
@@ -3,7 +3,9 @@
*
[
与js开发的差别
](
tutorial/codegap.md
)
*
[
request联网教程
](
tutorial/request.md
)
*
[
全局变量与状态管理
](
tutorial/store.md
)
*
[
编译器
](
compiler/README.md
)
*
[编译器]
*
[
概述
](
compiler/README.md
)
*
[
条件编译
](
/tutorial/platform.md
)
*
全局文件
*
[
main.uts
](
/collocation/main.md
)
*
[
app.uvue
](
/collocation/App.md
)
...
...
@@ -11,6 +13,12 @@
*
[
AndroidManifest.xml
](
/tutorial/app-nativeresource-android.md
)
*
[
pages.json
](
/collocation/pages.md
)
*
[
uni.scss
](
/collocation/uni-scss.md
)
*
[
页面
](
/tutorial/page.md
)
*
vue语法
*
[
概述
](
vue/README.md
)
*
[
基础
](
/tutorial/vue3-basics.md
)
*
[
组件
](
/tutorial/vue3-components.md
)
*
[
API
](
/tutorial/vue3-api.md
)
*
组件
*
[
公共属性和事件
](
component/common.md
)
*
[
view
](
component/view.md
)
...
...
docs/uni-app-x/api.md
浏览文件 @
f74b266b
#
基础
#
API概述
uni-app x支持的API包括:
-
uts的api
[
详见
](
/uts/buildin-object-api/global.md
)
-
uni.xxx的内置api。见左侧
-
uniCloud.xxx的内置api。见左侧
## uni.exit(options?) @exit
由于uts可以直接调用Android和iOS的API,所以os和三方sdk的能力都可以在uts中调用。
<!-- UTSAPIJSON.exit.description -->
<!-- UTSAPIJSON.exit.param -->
<!-- UTSAPIJSON.exit.returnValue -->
<!-- UTSAPIJSON.exit.compatibility -->
<!-- UTSAPIJSON.exit.tutorial -->
# 界面
## uni.previewImage(options) @previewimage
<!-- UTSAPIJSON.previewImage.description -->
<!-- UTSAPIJSON.previewImage.param -->
<!-- UTSAPIJSON.previewImage.returnValue -->
<!-- UTSAPIJSON.previewImage.compatibility -->
<!-- UTSAPIJSON.previewImage.tutorial -->
## uni.closePreviewImage(options) @closepreviewimage
<!-- UTSAPIJSON.closePreviewImage.description -->
<!-- UTSAPIJSON.closePreviewImage.param -->
<!-- UTSAPIJSON.closePreviewImage.returnValue -->
<!-- UTSAPIJSON.closePreviewImage.compatibility -->
<!-- UTSAPIJSON.closePreviewImage.tutorial -->
## uni.showToast(options) @showtoast
<!-- UTSAPIJSON.showToast.description -->
<!-- UTSAPIJSON.showToast.param -->
<!-- UTSAPIJSON.showToast.returnValue -->
<!-- UTSAPIJSON.showToast.compatibility -->
<!-- UTSAPIJSON.showToast.tutorial -->
## uni.hideToast() @hidetoast
<!-- UTSAPIJSON.hideToast.description -->
<!-- UTSAPIJSON.hideToast.param -->
<!-- UTSAPIJSON.hideToast.returnValue -->
<!-- UTSAPIJSON.hideToast.compatibility -->
<!-- UTSAPIJSON.hideToast.tutorial -->
## uni.showLoading(options) @showloading
<!-- UTSAPIJSON.showLoading.description -->
<!-- UTSAPIJSON.showLoading.param -->
<!-- UTSAPIJSON.showLoading.returnValue -->
<!-- UTSAPIJSON.showLoading.compatibility -->
<!-- UTSAPIJSON.showLoading.tutorial -->
## uni.hideLoading() @hideloading
<!-- UTSAPIJSON.hideLoading.description -->
<!-- UTSAPIJSON.hideLoading.param -->
<!-- UTSAPIJSON.hideLoading.returnValue -->
<!-- UTSAPIJSON.hideLoading.compatibility -->
<!-- UTSAPIJSON.hideLoading.tutorial -->
## uni.showModal(options) @showmodal
<!-- UTSAPIJSON.showModal.description -->
<!-- UTSAPIJSON.showModal.param -->
<!-- UTSAPIJSON.showModal.returnValue -->
<!-- UTSAPIJSON.showModal.compatibility -->
<!-- UTSAPIJSON.showModal.tutorial -->
## uni.showActionSheet(options) @showactionsheet
<!-- UTSAPIJSON.showActionSheet.description -->
<!-- UTSAPIJSON.showActionSheet.param -->
<!-- UTSAPIJSON.showActionSheet.returnValue -->
<!-- UTSAPIJSON.showActionSheet.compatibility -->
<!-- UTSAPIJSON.showActionSheet.tutorial -->
# 网络
## uni.getNetworkType(options) @getnetworktype
<!-- UTSAPIJSON.getNetworkType.description -->
<!-- UTSAPIJSON.getNetworkType.param -->
<!-- UTSAPIJSON.getNetworkType.returnValue -->
<!-- UTSAPIJSON.getNetworkType.compatibility -->
<!-- UTSAPIJSON.getNetworkType.tutorial -->
## uni.request(param) @request
<!-- UTSAPIJSON.request.description -->
<!-- UTSAPIJSON.request.param -->
<!-- UTSAPIJSON.request.returnValue -->
<!-- UTSAPIJSON.request.compatibility -->
<!-- UTSAPIJSON.request.tutorial -->
## uni.downloadFile(options) @downloadfile
<!-- UTSAPIJSON.downloadFile.description -->
<!-- UTSAPIJSON.downloadFile.param -->
<!-- UTSAPIJSON.downloadFile.returnValue -->
<!-- UTSAPIJSON.downloadFile.compatibility -->
<!-- UTSAPIJSON.downloadFile.tutorial -->
## uni.connectSocket(options) @connectsocket
<!-- UTSAPIJSON.connectSocket.description -->
<!-- UTSAPIJSON.connectSocket.param -->
<!-- UTSAPIJSON.connectSocket.returnValue -->
<!-- UTSAPIJSON.connectSocket.compatibility -->
<!-- UTSAPIJSON.connectSocket.tutorial -->
## uni.onSocketOpen(options) @onsocketopen
<!-- UTSAPIJSON.onSocketOpen.description -->
<!-- UTSAPIJSON.onSocketOpen.param -->
<!-- UTSAPIJSON.onSocketOpen.returnValue -->
<!-- UTSAPIJSON.onSocketOpen.compatibility -->
<!-- UTSAPIJSON.onSocketOpen.tutorial -->
## uni.onSocketError(callback) @onsocketerror
<!-- UTSAPIJSON.onSocketError.description -->
<!-- UTSAPIJSON.onSocketError.param -->
<!-- UTSAPIJSON.onSocketError.returnValue -->
<!-- UTSAPIJSON.onSocketError.compatibility -->
<!-- UTSAPIJSON.onSocketError.tutorial -->
## uni.sendSocketMessage(options) @sendsocketmessage
<!-- UTSAPIJSON.sendSocketMessage.description -->
<!-- UTSAPIJSON.sendSocketMessage.param -->
<!-- UTSAPIJSON.sendSocketMessage.returnValue -->
<!-- UTSAPIJSON.sendSocketMessage.compatibility -->
<!-- UTSAPIJSON.sendSocketMessage.tutorial -->
## uni.onSocketMessage(callback) @onsocketmessage
<!-- UTSAPIJSON.onSocketMessage.description -->
<!-- UTSAPIJSON.onSocketMessage.param -->
<!-- UTSAPIJSON.onSocketMessage.returnValue -->
<!-- UTSAPIJSON.onSocketMessage.compatibility -->
<!-- UTSAPIJSON.onSocketMessage.tutorial -->
## uni.closeSocket(options) @closesocket
<!-- UTSAPIJSON.closeSocket.description -->
<!-- UTSAPIJSON.closeSocket.param -->
<!-- UTSAPIJSON.closeSocket.returnValue -->
<!-- UTSAPIJSON.closeSocket.compatibility -->
<!-- UTSAPIJSON.closeSocket.tutorial -->
## uni.onSocketClose(callback) @onsocketclose
<!-- UTSAPIJSON.onSocketClose.description -->
<!-- UTSAPIJSON.onSocketClose.param -->
<!-- UTSAPIJSON.onSocketClose.returnValue -->
<!-- UTSAPIJSON.onSocketClose.compatibility -->
<!-- UTSAPIJSON.onSocketClose.tutorial -->
# 存储
## uni.setStorage(options) @setstorage
<!-- UTSAPIJSON.setStorage.description -->
<!-- UTSAPIJSON.setStorage.param -->
<!-- UTSAPIJSON.setStorage.returnValue -->
<!-- UTSAPIJSON.setStorage.compatibility -->
<!-- UTSAPIJSON.setStorage.tutorial -->
## uni.setStorageSync(key, data) @setstoragesync
<!-- UTSAPIJSON.setStorageSync.description -->
<!-- UTSAPIJSON.setStorageSync.param -->
<!-- UTSAPIJSON.setStorageSync.returnValue -->
<!-- UTSAPIJSON.setStorageSync.compatibility -->
<!-- UTSAPIJSON.setStorageSync.tutorial -->
## uni.getStorage(options) @getstorage
<!-- UTSAPIJSON.getStorage.description -->
<!-- UTSAPIJSON.getStorage.param -->
<!-- UTSAPIJSON.getStorage.returnValue -->
<!-- UTSAPIJSON.getStorage.compatibility -->
<!-- UTSAPIJSON.getStorage.tutorial -->
## uni.getStorageSync(key) @getstoragesync
<!-- UTSAPIJSON.getStorageSync.description -->
<!-- UTSAPIJSON.getStorageSync.param -->
<!-- UTSAPIJSON.getStorageSync.returnValue -->
<!-- UTSAPIJSON.getStorageSync.compatibility -->
<!-- UTSAPIJSON.getStorageSync.tutorial -->
## uni.getStorageInfo(options) @getstorageinfo
<!-- UTSAPIJSON.getStorageInfo.description -->
<!-- UTSAPIJSON.getStorageInfo.param -->
<!-- UTSAPIJSON.getStorageInfo.returnValue -->
<!-- UTSAPIJSON.getStorageInfo.compatibility -->
<!-- UTSAPIJSON.getStorageInfo.tutorial -->
## uni.getStorageInfoSync() @getstorageinfosync
<!-- UTSAPIJSON.getStorageInfoSync.description -->
<!-- UTSAPIJSON.getStorageInfoSync.param -->
<!-- UTSAPIJSON.getStorageInfoSync.returnValue -->
<!-- UTSAPIJSON.getStorageInfoSync.compatibility -->
<!-- UTSAPIJSON.getStorageInfoSync.tutorial -->
## uni.removeStorage(options) @removestorage
<!-- UTSAPIJSON.removeStorage.description -->
<!-- UTSAPIJSON.removeStorage.param -->
<!-- UTSAPIJSON.removeStorage.returnValue -->
<!-- UTSAPIJSON.removeStorage.compatibility -->
<!-- UTSAPIJSON.removeStorage.tutorial -->
## uni.removeStorageSync(key) @removestoragesync
<!-- UTSAPIJSON.removeStorageSync.description -->
<!-- UTSAPIJSON.removeStorageSync.param -->
<!-- UTSAPIJSON.removeStorageSync.returnValue -->
<!-- UTSAPIJSON.removeStorageSync.compatibility -->
<!-- UTSAPIJSON.removeStorageSync.tutorial -->
## uni.clearStorage(option) @clearstorage
<!-- UTSAPIJSON.clearStorage.description -->
<!-- UTSAPIJSON.clearStorage.param -->
<!-- UTSAPIJSON.clearStorage.returnValue -->
<!-- UTSAPIJSON.clearStorage.compatibility -->
<!-- UTSAPIJSON.clearStorage.tutorial -->
## uni.clearStorageSync() @clearstoragesync
<!-- UTSAPIJSON.clearStorageSync.description -->
<!-- UTSAPIJSON.clearStorageSync.param -->
<!-- UTSAPIJSON.clearStorageSync.returnValue -->
<!-- UTSAPIJSON.clearStorageSync.compatibility -->
<!-- UTSAPIJSON.clearStorageSync.tutorial -->
# 定位
## uni.getLocation(options) @getlocation
<!-- UTSAPIJSON.getLocation.description -->
<!-- UTSAPIJSON.getLocation.param -->
<!-- UTSAPIJSON.getLocation.returnValue -->
<!-- UTSAPIJSON.getLocation.compatibility -->
<!-- UTSAPIJSON.getLocation.tutorial -->
## uni.getLocation(options) @getlocation
<!-- UTSAPIJSON.getLocation.description -->
<!-- UTSAPIJSON.getLocation.param -->
<!-- UTSAPIJSON.getLocation.returnValue -->
<!-- UTSAPIJSON.getLocation.compatibility -->
<!-- UTSAPIJSON.getLocation.tutorial -->
# 媒体
## uni.chooseImage(options) @chooseimage
<!-- UTSAPIJSON.chooseImage.description -->
<!-- UTSAPIJSON.chooseImage.param -->
<!-- UTSAPIJSON.chooseImage.returnValue -->
<!-- UTSAPIJSON.chooseImage.compatibility -->
<!-- UTSAPIJSON.chooseImage.tutorial -->
## uni.saveImageToPhotosAlbum(options) @saveimagetophotosalbum
<!-- UTSAPIJSON.saveImageToPhotosAlbum.description -->
<!-- UTSAPIJSON.saveImageToPhotosAlbum.param -->
<!-- UTSAPIJSON.saveImageToPhotosAlbum.returnValue -->
<!-- UTSAPIJSON.saveImageToPhotosAlbum.compatibility -->
<!-- UTSAPIJSON.saveImageToPhotosAlbum.tutorial -->
# 设备
## uni.getAppAuthorizeSetting() @getappauthorizesetting
<!-- UTSAPIJSON.getAppAuthorizeSetting.description -->
<!-- UTSAPIJSON.getAppAuthorizeSetting.param -->
<!-- UTSAPIJSON.getAppAuthorizeSetting.returnValue -->
<!-- UTSAPIJSON.getAppAuthorizeSetting.compatibility -->
<!-- UTSAPIJSON.getAppAuthorizeSetting.tutorial -->
## uni.getAppBaseInfo(config) @getappbaseinfo
<!-- UTSAPIJSON.getAppBaseInfo.description -->
<!-- UTSAPIJSON.getAppBaseInfo.param -->
<!-- UTSAPIJSON.getAppBaseInfo.returnValue -->
<!-- UTSAPIJSON.getAppBaseInfo.compatibility -->
<!-- UTSAPIJSON.getAppBaseInfo.tutorial -->
## uni.getDeviceInfo(config) @getdeviceinfo
<!-- UTSAPIJSON.getDeviceInfo.description -->
<!-- UTSAPIJSON.getDeviceInfo.param -->
<!-- UTSAPIJSON.getDeviceInfo.returnValue -->
<!-- UTSAPIJSON.getDeviceInfo.compatibility -->
<!-- UTSAPIJSON.getDeviceInfo.tutorial -->
## uni.getSystemInfo(options) @getsysteminfo
<!-- UTSAPIJSON.getSystemInfo.description -->
<!-- UTSAPIJSON.getSystemInfo.param -->
<!-- UTSAPIJSON.getSystemInfo.returnValue -->
<!-- UTSAPIJSON.getSystemInfo.compatibility -->
<!-- UTSAPIJSON.getSystemInfo.tutorial -->
## uni.getSystemInfoSync() @getsysteminfosync
<!-- UTSAPIJSON.getSystemInfoSync.description -->
<!-- UTSAPIJSON.getSystemInfoSync.param -->
<!-- UTSAPIJSON.getSystemInfoSync.returnValue -->
<!-- UTSAPIJSON.getSystemInfoSync.compatibility -->
<!-- UTSAPIJSON.getSystemInfoSync.tutorial -->
## uni.getWindowInfo() @getwindowinfo
<!-- UTSAPIJSON.getWindowInfo.description -->
<!-- UTSAPIJSON.getWindowInfo.param -->
<!-- UTSAPIJSON.getWindowInfo.returnValue -->
<!-- UTSAPIJSON.getWindowInfo.compatibility -->
<!-- UTSAPIJSON.getWindowInfo.tutorial -->
## uni.getSystemSetting() @getsystemsetting
<!-- UTSAPIJSON.getSystemSetting.description -->
<!-- UTSAPIJSON.getSystemSetting.param -->
<!-- UTSAPIJSON.getSystemSetting.returnValue -->
<!-- UTSAPIJSON.getSystemSetting.compatibility -->
<!-- UTSAPIJSON.getSystemSetting.tutorial -->
<!-- UTSAPIJSON.general_type.name -->
<!-- UTSAPIJSON.general_type.param -->
\ No newline at end of file
一般原生能力建议封装为
[
uni_modules
](
/plugin/uni_modules.md
)
\ No newline at end of file
docs/uni-app-x/api/getLocation.md
浏览文件 @
f74b266b
...
...
@@ -8,6 +8,16 @@
<!-- UTSAPIJSON.getLocation.compatibility -->
### 注意
uni-app x的定位,默认是系统定位,system。真机运行基座不包含三方定位sdk。
三方定位sdk方面,暂不支持高德、百度,但支持腾讯定位。可下载腾讯定位插件,在插件中配置key打包后生效。
如需其他定位,请在插件市场搜索定位相关的uts插件。
不管系统定位、还是三方sdk定位,都有很多注意事项,包括gms、坐标系、隐私和权限等,请仔细阅读下面的参考链接。
<!-- UTSAPIJSON.getLocation.tutorial -->
<!-- UTSAPIJSON.general_type.name -->
...
...
docs/uni-app-x/api/getSystemInfo.md
浏览文件 @
f74b266b
...
...
@@ -2,6 +2,18 @@
<!-- UTSAPIJSON.getSystemInfo.description -->
uni-app 提供了异步(
`uni.getSystemInfo`
)和同步(
`uni.getSystemInfoSync`
)的2个API获取系统信息。
按照运行环境层级排序,从底层向上,systemInfo有6个概念:
-
`device`
:运行应用的设备,如iphone、huawei
-
`os`
:设备的操作系统,如 ios、andriod、windows、mac、linux
-
`rom`
:基于操作系统的定制,Android系统特有概念,如miui、鸿蒙
-
`host`
:运行应用的宿主程序,即OS和应用之间的运行环境,如浏览器、微信等小程序宿主、集成uniMPSDK的App。uni-app直接开发的app没有host概念
-
`uni`
:uni-app框架相关的信息,如uni-app框架的编译器版本、运行时版本
-
`app`
:开发者的应用相关的信息,如应用名称、版本
[
详见
](
https://uniapp.dcloud.net.cn/api/system/info.html#getsysteminfo
)
<!-- UTSAPIJSON.getSystemInfo.param -->
<!-- UTSAPIJSON.getSystemInfo.returnValue -->
...
...
docs/uni-app-x/css/font-family.md
浏览文件 @
f74b266b
...
...
@@ -10,6 +10,11 @@
<!-- CSSJSON.font-family.compatibility -->
#### App平台差异
font-family 样式不支持继承,仅对
[
text
](
uni-app-x/component/text.md
)
组件生效。
-
font-family 样式不支持继承,仅对
[
text
](
uni-app-x/component/text.md
)
组件生效。
#### 字体图标
支持ttf和otf字体图标。
-
可在css里直接加载,
[
参考
](
https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/CSS/text/font-family.uvue
)
-
也可以使用API
[
uni.loadFontface
](
../api/loadFontFace.md
)
<!-- CSSJSON.font-family.reference -->
docs/uni-app-x/css/readme.md
浏览文件 @
f74b266b
...
...
@@ -218,6 +218,8 @@ uni-app x的css的样式不继承规则,虽然与web有差异,其实只是
|CSS Variable |√ | |
|媒体查询 |√ | |
字体图标
[
详见
](
font-family.md
)
## 选择器
|类别 |示例 |支持情况 |备注 |
|:-: |:-: |:-: |:-: |
...
...
@@ -261,6 +263,7 @@ uni-app x的css的样式不继承规则,虽然与web有差异,其实只是
|hsl | | |
|hsla | | |
## At-rules
|类别 |支持情况 |备注 |
|:-: |:-: |:-: |
...
...
docs/uni-app-x/readme.md
浏览文件 @
f74b266b
...
...
@@ -225,13 +225,23 @@ uni自带API,如下为目前支持的清单。
### 性能
*
[x] uni.getPerformance
## 5. 全局文件
-
manifest.json 仅支持基本的名称图标配置,暂未支持splash。支持CPU类型abiFilters、Android版本minSdkVersion、targetSdkVersion。
### uniCloud
*
[x] uniCloud.callFunction
云对象和clientDB还不支持。
## 5. vue语法
-
uvue是按vue3规范实现的,但一期uvue不支持setup,只支持选项式
-
目前也不支持vue插件,比如pinia、vuex、i18n、router。简单的状态管理可以参考文档
[
全局变量和状态管理
](
tutorial/store.md
)
## 6. 全局文件
-
manifest.json 仅支持基本的名称图标配置,暂未支持splash。支持CPU类型abiFilters、Android版本minSdkVersion、targetSdkVersion。
[
详见
](
manifest.md
)
-
AndroidManifest.xml 与原生开发相同。注意Android权限配置在这里配置,而不是在manifest.json中
[
详见
](
https://uniapp.dcloud.net.cn/tutorial/app-nativeresource-android.html
)
-
pages.json 不支持app-plus的内容
-
app.uvue 不支持globaldata。
[
详见
](
/docs/collocation/App.md
)
-
pages.json 不支持app-plus的内容。
[
详见
](
/docs/collocation/pages.md
)
-
uni.scss 正常支持。但注意uvue仅能使用
[
css子集
](
css/README.md
)
##
6
. 插件兼容
##
7
. 插件兼容
插件市场的uts插件,不管是API插件还是组件,均可同时在 uni-app js引擎版 和 uni-app x 上运行。
...
...
@@ -246,9 +256,8 @@ uni-app js版的“App原生语言插件”无法在 uni-app x 中运行。
除上述文档中声明已经完成的,还有如下需要注意:
-
全端支持:一期只有Android。虽然uts语言支持swift,可以写原生插件,但iOS版的uvue还未开发完毕。对于iOS或其他小程序、web平台,开发者可将uvue文件后缀改为vue或nvue,如果没有写Android专有代码,那么也可以使用uni-app js引擎版编译到其他平台,包括iOS App、web及各家小程序。尤其在app-iOS上,由于设备性能本就优秀,所以nvue的方案的性能也足够满足挑剔的开发者。后期官方会提供更完善的 uni-app x的全端支持。
-
uvue语法:虽然uvue是按vue3实现的,但一期uvue不支持setup,只支持选项式。
-
一期不支持:横屏切换、暗黑模式、自定义转场、多语言、无障碍
-
一期不支持:云开发(已在开发中)、uni-ad。另外包括微信、支付宝、个推等三方sdk封装一期均未启动
-
一期不支持:横屏切换、暗黑模式、自定义路由、多语言、无障碍
-
一期不支持:uni-ad。另外包括微信、支付宝、个推、地图等三方sdk封装官方均未启动
-
一期不支持国际区账户创建和打包uni-app x,仅大陆区开发者账户可用。
欢迎去
[
需求墙
](
https://vote.dcloud.net.cn/#/?name=uni-app%20x
)
投票,告诉我们你的需求优先级。
...
...
docs/uni-app-x/tutorial/request.md
浏览文件 @
f74b266b
...
...
@@ -49,19 +49,22 @@ uni.request({
为json数据定义一个type的自定义类型,明确好对象的属性名称及类型,然后把这个type通过泛型传给request方法,res拿出来的就是转换好的类型,就可以直接
`.操作符`
获取属性了。。
先不讲原理,先给个使用范例,然后再解读原理。
-
第一步:用HBuilderX自带的工具,给服务器数据定义类型
把服务器端返回的json数据,复制黏贴到HBuilderX的json编辑器里,点右键,转type。
把服务器端返回的
data里的
json数据,复制黏贴到HBuilderX的json编辑器里,点右键,转type。
![](
../static/json2type.png
)
> 转换功能需要HBuilderX 3.9+、安装了uni-app x真机运行插件、且打开的标签卡是json编辑器。(在ctrl+t新建空白md标签卡,粘贴json数据,会自动切换成json编辑器)
上面的截图是复用了其他图片,如果我们使用
这个服务器接口,服务器返回的数据内容,也就是res.data
的数据是这样:
上面的截图是复用了其他图片,如果我们使用
`https://ext.dcloud.net.cn/plugin/uniappx-plugin-list`
这个服务器接口,服务器返回的数据内容,也就是
`res.data`
的数据是这样:
```
json
{
code:
200
,
desc:
""
,
data:
[{
"plugin_name"
:
"插件名称A"
,
"plugin_id"
:
123
}]}
```
**注意:**
不要把res和res.data搞错了,要看
`res.data`
的数据格式,而不是
`res`
的格式。
`res`
的格式是不变的。
观察返回的数据,
`res.data`
返回一个对象,拥有code、desc、data这3个子属性,code是number类型,desc是string类型,而data的类型又是一个数组。
该数组内又是若干子对象,子对象有属性
`plugin_id`
和
`plugin_name`
等。
那么使用转换工具,生成的类型定义是这样:
```
ts
type
Data
=
{
...
...
@@ -75,8 +78,12 @@ type IRootType = {
}
```
因type不可嵌套,生成了2个type。注意顺序,Data这个type需写在前面,因为后面要引用它。引用代码执行时如未定义该类型,会报错。
-
第二步:把这段类型定义,放在
`<script>`
根下,也就是export default{}之前。然后给uni.request传入泛型参数
`<IRootType>`
,返回的res自动转换好了类型,可以直接
`.`
属性了。
**注意:**
因为
`res.data`
是对象,所以泛型那里直接使用
`<IRootType>`
。有的服务器接口返回的
`res.data`
是数组,就需要在泛型那里写成
`<IRootType[]>`
```
vue
<
script
>
type
Data
=
{
...
...
@@ -94,7 +101,7 @@ type IRootType = {
url
:
"
https://ext.dcloud.net.cn/plugin/uniappx-plugin-list
"
,
success
:
(
res
)
=>
{
console
.
log
(
res
.
data
)
console
.
log
(
res
.
data
instanceof
IRootType
)
//true
console
.
log
(
res
.
data
instanceof
IRootType
)
//true
res.data已经被转换为type了
console
.
log
(
res
.
data
?.
data
)
//因为联网数据不可控,转换可能失败,所以这里需要用?.的方式做安全访问
let
resData
=
res
.
data
?.
data
if
(
resData
!=
null
&&
resData
.
length
>
0
){
//判断一下数组不为空
...
...
@@ -107,12 +114,16 @@ type IRootType = {
</
script
>
```
与UTSJSONObject方式相比,不用使用as做很多转换,虽然需要定义type,但由于有工具可以自动生成type,所以整体使用体验,比UTSJSONObject方式
更方便
。
与UTSJSONObject方式相比,不用使用as做很多转换,虽然需要定义type,但由于有工具可以自动生成type,所以整体使用体验,比UTSJSONObject方式
方便一点
。
type+泛型这个方式,也是ts开发者惯用的方式。
但不熟悉ts的开发者,可能不了解type和泛型。下面讲解下。
### type和泛型详解
-
什么是type和泛型?
type就是自定义一个类型。下面定义了一个数据类型DataType,该类型有2个属性,
`plugin_id`
和
`plugin_name`
,这2个属性的类型分别是number和string。
```
ts
type
DataType
=
{
...
...
@@ -127,50 +138,22 @@ type DataType = {
而泛型,是一个对方法参数进行通用的类型描述。它告诉一个支持泛型的方法,给方法传入什么类型,方法就会返回什么类型。
详见
[
泛型
](
../../uts/generics.md
)
不过uts的泛型支持还没有达到ts的泛型完善度,
详见
[
泛型
](
../../uts/generics.md
)
uni.request方法是支持泛型的,这意味着返回结果可以有很多种类型。
所以可以把你定义的DataType类型通过
<T>
的方式传给uni.request方法,尖括号要写在方法名和左圆括号中间。
这个方法就会把返回的res转换为你传入的DataType类型。
下面来举例:
所以可以把你定义的DataType类型通过
`<T>`
的方式传给uni.request方法,尖括号要写在方法名和左圆括号中间。
这个方法就会把返回的
`res.data`
转换为你传入的DataType类型。
服务器返回的数据内容,也就是res.data的数据是这样:
```
json
{
code:
200
,
desc:
""
,
data:
[{
"plugin_name"
:
"插件名称A"
,
"plugin_id"
:
123
}]}
```
观察数据,这是一个对象,拥有code、desc、data这3个子属性,code是number类型,desc是string类型,而data的类型又是一个数组。
该数组内又是若干子对象,子对象有属性
`plugin_id`
和
`plugin_name`
等。
-
为何type要定义在export default{}之前?
对于这种父子结构,我们需要定义2个类型才能描述,因为每一层都需要一个type
。
其实如果type不用于vue data数据的类型,那么type只需要定义在执行前就可以
。
-
IRootType是一级的类型,它有3个属性,其中有一个data属性,类型是另一个type data的数组方式。
-
而Data是二级数组中对象的类型,有2个属性
`plugin_id`
和
`plugin_name`
但实际开发中,type大多用于data的类型定义,而想给data定义类型,那就得写在data的前面,也就是export default{}之前了。
注意顺序,Data这个type需写在前面,因为后面要引用它。引用代码执行时如未定义该类型,会报错。
-
网络数据缺少一些属性怎么办?
```
ts
// uts中为json数据定义类型
type
DataType
=
{
plugin_id
:
number
,
plugin_name
:
string
}
//定义一个DataType类型,含有number类型的plugin_id属性,和string类型的plugin_name属性
type
IRootType
=
{
code
:
number
;
desc
:
string
;
data
:
Data
[];
}
```
那为何type一定要定义在export default{}之前?
其实上面的代码,type只需要定义在uni.request方法执行前就可以。但实际开发中,type大多用于data的类型定义,
而想给data定义类型,那就得写在data的前面,也就是export default{}之前了。
还有一个问题,网络返回的数据,有可能缺少某些属性,该怎么写? 把类型声明为"或null",或者使用
`?:`
网络返回的数据,有可能缺少某些属性,导致报错。测试需要把可为空的属性类型声明为"或null",或者使用
`?:`
```
ts
type
DataType
=
{
plugin_id
:
number
,
...
...
@@ -181,9 +164,28 @@ type DataType = {
如您不了解null的安全使用,
[
详见
](
../../uts/data-type.md#null
)
再举一个实际中更常见的例子。
-
务必注意res.data返回的是对象还是数组
如果res.data返回的是对象,那么泛型调用时直接
`uni.request<IRootType>(`
如果res.data返回的是数组,那么传泛型时必须传入数组格式
`uni.request<IRootType[]>(`
-
type的敏感词转义
服务器返回的json数据,其属性键名有可能存在一些type不支持的字符。
比如
`{"a:b":"123","a-b":"456"}`
,这些键名对于type来讲都是非法的。转换type就会失败。
如果你的服务器数据涉及这类问题且数据格式不可改,那只能改用UTSJSONObject方式。
特殊词清单详见:
[
type
](
../../uts/data-type.md#type
)
### 完整实例
再举一个实际中更常见的例子。联网获取插件市场的插件列表数据,并绑定在模板上,还可以翻页。
联网获取插件市场的插件列表数据,并绑定在模板上,还可以翻页。
翻页需要用到
[
...展开操作符
](
../../uts/operator.md#展开语法...
)
```
vue
<
template
>
...
...
docs/uni-app-x/tutorial/store.md
浏览文件 @
f74b266b
# 全局变量与状态管理
`uni-app x`
可通过一个专用模块组织和管理全局变量与状态。示例:
`uni-app x`
不支持globaldata,目前也不支持pinia和vuex。但可通过一个专用模块组织和管理全局变量与状态。
定义一个模块,编写一个单独的uts文件,比如 /store/index.uts,在里面设一个全局变量,比如globalNum。
```
ts
//
store/index.uts
//
定义一个大写的State类型
export
type
State
=
{
globalNum
:
number
// 如有需要,可增加更多属性
}
// 实例化为state
export
const
state
=
reactive
({
globalNum
:
0
}
as
State
)
// 定义修改属性值的方法
export
const
setGlobalNum
=
(
num
:
number
)
=>
{
state
.
globalNum
=
num
}
```
```
ts
// pages/index/index.uvue
在需要的页面和uts文件里,import上面的/store/index.uts,通过如下方式读和写globalNum。
```
vue
<
template
>
<text
@
click=
"plus"
>
{{
globalNum
}}
</text>
</
template
>
<
script
lang=
"uts"
>
import
{
state
,
setGlobalNum
}
from
'
@/store/index.uts
'
import
{
state
,
setGlobalNum
}
from
'
@/store/index.uts
'
//导出state和修改其属性值的方法,如不需要修改值,则不需要导出修改方法
export
default
{
computed
:
{
globalNum
():
number
{
globalNum
():
number
{
//定义可绑定在界面上的globalNum
return
state
.
globalNum
}
},
...
...
@@ -36,4 +40,6 @@ export const setGlobalNum = (num: number) => {
}
}
</
script
>
```
\ No newline at end of file
```
不管在哪里修改了globalNum的值,界面上都会自动更新。
\ No newline at end of file
docs/uni-app-x/vue/readme.md
0 → 100644
浏览文件 @
f74b266b
# vue
uni-app x的vue语法,是按vue3规范实现的,但一期uvue不支持setup,只支持选项式。
目前也不支持vue插件,比如pinia、vuex、i18n、router。简单的状态管理可以参考文档
[
全局变量和状态管理
](
tutorial/store.md
)
还有一些支持差异,在左侧文档点开后搜索“uni-app x”可见。
-
组件使用注意
默认组件的后缀名为.vue。而不是.uvue。
.vue里面写uvue的语法,可以正常被.uvue页面引用和编译。
如果使用.uvue的组件,则需要手动import,包括easycom也必须配规则才能识别。
docs/uts/data-type.md
浏览文件 @
f74b266b
...
...
@@ -450,9 +450,23 @@ const l = b.length // 错误:变量“b”可能为空
我们要庆幸编译器的报错,因为如果编译器放过后,在线上运行时万一真的为空,那会导致崩溃。
如何正确访问可能为null的对象的属性和方法?有几种方式可以做到。
除了变量,类型的属性也可以为null。此时可以和变量一样使用
` | null`
,还可以用
`?:`
来代表可选
```
ts
type
obj
=
{
id
:
number
,
name
:
string
,
age
:
number
|
null
,
sex
?:
boolean
}
```
方法参数的可为空,也就是可选参数,其实意思是该参数有默认值,你可以不填,不填就使用默认值,具体见
[
function
](
function.md#默认参数
)
### 安全的访问null
定义可为空后,如何安全访问?
#### 1. 代码中判空后再使用
如果你的代码已经判空,则编译器不会再告警。你可以显式检测 b 是否为 null,在不为 null 的情况下调用 b 的属性和方法。
...
...
@@ -507,10 +521,10 @@ console.log(baz);
```
ts
const
l
=
b
!
.
length
```
<!--
### vue data中null的用法
很多时候,data的数据需要通过script获取,而 uts 不支持 undefined,初始化时就只能赋null。
很多时候,data的数据需要通过script获取,而 uts 不支持 undefined,初始化时就只能赋null。
一旦定义可为null后,调用时就需要用
`?.`
操作可选属性。
```
html
<script
lang=
uts
>
...
...
@@ -537,7 +551,7 @@ const l = b!.length
}
</script>
```
-->
## 日期(Date)@date
日期对象表示日期,包括年月日时分秒等各种日期。
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录