提交 99d28c2a 编写于 作者: W wanganxp

更新文档

上级 32c6acd7
......@@ -4,6 +4,8 @@
<!-- UTSAPIJSON.createInnerAudioContext.compatibility -->
App音频播放:[见插件市场](https://ext.dcloud.net.cn/search?q=%E9%9F%B3%E9%A2%91%E6%92%AD%E6%94%BE&orderBy=Relevance&uni-appx=1)
<!-- UTSAPIJSON.createInnerAudioContext.param -->
<!-- UTSAPIJSON.createInnerAudioContext.returnValue -->
......
......@@ -2,6 +2,8 @@
<!-- UTSAPIJSON.createMapContext.description -->
参考:[Map组件](../component/map.md)
<!-- UTSAPIJSON.createMapContext.compatibility -->
<!-- UTSAPIJSON.createMapContext.param -->
......
......@@ -2,6 +2,16 @@
<!-- UTSAPIJSON.createSelectorQuery.description -->
createSelectorQuery是小程序的API,因小程序未开放DOM,且视图层和逻辑层分离,于是提供了一个异步的API,可以在逻辑层有限的获取一些DOM能力。
该API返回的类型为NodeRef。它和DOM的Element有区别。
大多数组件的属性和样式操作,是通过绑定vue的响应式变量data来实现的。一般不使用本API。
本API的主要用途是小程序下获取元素计算后的样式。如果您的应用不适配小程序,那么在Web和App上有更强大的[UniElement](../dom/README.md)
小程序下有时用本API获取部分组件的上下文context,但这个写法不跨平台。跨平台的获取组件context,应该使用uni.createXXContext()。
<!-- UTSAPIJSON.createSelectorQuery.compatibility -->
<!-- UTSAPIJSON.createSelectorQuery.param -->
......
......@@ -2,12 +2,7 @@
<!-- UTSAPIJSON.createWebviewContext.description -->
由于本API仅在App端支持。推荐直接使用DOM API操作。UniWebViewElement比webviewContext有更多属性和方法。例如:
```js
let wv = uni.getElementById("wv1") as UniWebViewElement
```
如果您继续使用createWebviewContext,请注意第2个参数问题。
参考:[web-view组件](../component/web-view.md)
在不传入第2个component参数时,默认从页面栈顶的页面来查找这个webviewContext。
......@@ -15,13 +10,19 @@ let wv = uni.getElementById("wv1") as UniWebViewElement
- 选项式中,this代表当前vue实例。如果是在页面的export default内、函数外使用this,即代表该页面的组件实例。
```js
let v1 = uni.createWebviewContext("wv1", this)
let v1 = uni.createWebviewContext("wv1", this) //获取id为wx1的web-view组件的context
```
- 组合式中,通过getCurrentInstance()!.proxy! 获取当前页面的组件实例。
```js
let v1 = uni.createWebviewContext("wv1", getCurrentInstance()!.proxy!)
let v1 = uni.createWebviewContext("wv1", getCurrentInstance()!.proxy!) //获取id为wx1的web-view组件的context
```
由于本API仅在App端支持。也可以直接使用DOM API操作。UniWebViewElement比webviewContext有更多属性和方法。例如:
```js
let wv = uni.getElementById("wv1") as UniWebViewElement
```
<!-- UTSAPIJSON.createWebviewContext.compatibility -->
<!-- UTSAPIJSON.createWebviewContext.param -->
......
......@@ -4,6 +4,8 @@
<!-- UTSAPIJSON.makePhoneCall.compatibility -->
App平台见[插件市场](https://ext.dcloud.net.cn/search?q=%E7%94%B5%E8%AF%9D&orderBy=Relevance&uni-appx=1)
<!-- UTSAPIJSON.makePhoneCall.param -->
<!-- UTSAPIJSON.makePhoneCall.returnValue -->
......
......@@ -2,11 +2,13 @@
<!-- UTSAPIJSON.pageScrollTo.description -->
<!-- UTSAPIJSON.pageScrollTo.compatibility -->
可以滚动到指定的scrollTop值处,也可以滚动到指定的目标元素处(通过css选择器selector), 仅支持一级 class。
本API滚动的是栈顶的页面。
可以滚动到指定的scrollTop值处,也可以滚动到指定的目标元素处(通过css选择器selector), 仅支持一级 class
app-uvue下,其实没有页面级滚动。但本API做了一定兼容,当页面的根元素为scroll-view时,本API也会滚动该scroll-view。[详见](../css/README.md#pagescroll)
app-uvue下,只有页面的根元素为scroll-view时,本API才生效。[详见](../css/README.md#pagescroll)
<!-- UTSAPIJSON.pageScrollTo.compatibility -->
<!-- UTSAPIJSON.pageScrollTo.param -->
......@@ -31,7 +33,7 @@ selector类似于 CSS 的选择器,但仅支持下列语法。
## uni-app x 注意事项
1. app-uvue支持的选择器较少,不支持ID选择器,[详见](../css/README.md#选择器)
1. app-uvue支持的选择器较少,不支持ID选择器,[详见](../css/common/selector.md)
2. app-uvue的页面滚动,是由页面最外层的scroll-view模拟的,如果页面最外层不是scroll-view,无法使用本api。[详见](../css/README.md#pagescroll)
3. app-uvue的scroll-view滚动时,如需动画,则需要在scroll-view的属性中配置 `scroll-with-animation="true"`[详见](../component/scroll-view.md)
4. scroll-view的滚动,设置其scrollTop即可。[详见](../component/scroll-view.md)
......
......@@ -5,14 +5,15 @@
* Xcode 15.2及以上版本
## 接入流程
* 通过 `HBuilder X` 导出资源文件,根据资源内容,配置`原生主工程`环境,添加基础模块需要的依赖库以及资源文件
1. 在你的原生xcode工程中,接入uni原生SDK
2.`HBuilder X` 中导出资源文件,根据资源内容,配置`原生主工程`环境,添加基础模块需要的依赖库以及资源文件
* 根据资源文件中的`manifest.json`文件中包含的模块,制作`DCloudUTSExtAPI.xcframework`,并将其添加到`原生主工程`中,详见[集成内置模块](../modules/ios/modules.md)
* 根据资源文件中的`manifest.json`文件中包含的模块,向`原生主工程`添加工程配置以及内置模块需要的资源文件等,详见[集成内置模块](../modules/ios/modules.md)
* 根据资源文件中的`uni_modules`文件夹中包含的UTS插件,制作对应的原生xcframework,并将其添加到`原生主工程`(付费购买的uts插件不支持原生工程接入),详见[制作UTS插件](iosuts.md)
* 根据API文档接入SDK,详见[API文档](iosapi.md)
3. 在原生工程中,通过API启动uni原生SDK,详见[API文档](iosapi.md)
## 导出资源文件
1.工程中新建文件目录`uni-app-x/apps`
1.原生工程中新建文件目录`uni-app-x/apps`
![](https://web-ext-storage.dcloud.net.cn/native/doc/iOS/create_resources_document.png)
......@@ -24,20 +25,21 @@
![](https://web-ext-storage.dcloud.net.cn/native/doc/iOS/resources.png)
4.`app-ios` 目录下与`appid`对应的目录拷贝到工程的 `uni-app-x/apps` 目录下
4.`app-ios` 目录下与`appid`对应的目录拷贝到原生工程的 `uni-app-x/apps` 目录下
![](https://web-ext-storage.dcloud.net.cn/native/doc/iOS/copy_resources.png)
## 工程配置
## 原生工程配置
`Target -> General -> Minimum Deployments` 选择 `12.0`
`Target -> Build Settings -> Other Linker Flags` 中添加`-ObjC``-ld_classic``-weak_framework SwiftUI`
1. 若HBuilderX项目`根目录`下包含`Info.plist`文件,需要将该文件内容拷贝到`原生主工程``Target -> Info`
2.`Target -> Info` 下,添加如下配置
```
```xml
<dict>
<key>NSAppTransportSecurity</key>
<dict>
......
## uts for harmonyOS
本文旨在帮助 harmonyOS 开发者,快速上手 UTS。注意目前编译到鸿蒙时uts仅能编写uts api,uni-app-x项目不支持编译到harmonyOS。
鸿蒙系统有很多原生API,这些API通过ArkTS来调用。
由于uts可以编译为ArkTS,所以uts可以调用鸿蒙的所有原生API。
如需在uni-app中使用,就需要把鸿蒙的原生API封装为uts插件,然后在uni-app中使用。
这些uts插件,是同时兼容uni-app和uni-app x的。
但目前仅uni-app支持鸿蒙next,uni-app x还需过段时间。
uni-app中开发者的逻辑是编译为js,js无法直接调用鸿蒙原生API。而uts插件是编译为ets文件,所以可以调用鸿蒙原生API。(ArkTS的文件后缀为.ets)
## 1 了解 UTS 插件是什么
UTS 插件是 uni-app 新型插件形式 [详情](/plugin/uts-plugin)
UTS 插件是 uni-app 扩展API的标准插件形式 [详情](./uts-plugin.md)
uts插件在编译到harmonyOS端时会被编译成ArkTs代码。因此编写代码时应注意遵循uts规范+ets规范
uts插件在编译到harmonyOS端时会被编译成ArkTs代码。因此编写代码时应注意遵循 `uts规范``ets规范`
## 2 掌握UTS语法及ArkTs语法
......@@ -45,6 +55,7 @@ interface Obj {
const obj: Obj = {
a: 1
}
//或
const obj = {
a: 1
} as Obj
......
......@@ -16,7 +16,7 @@ uts,全称 uni type script,统一、强类型、脚本语言。
- web平台,编译为JavaScript
- Android平台,编译为Kotlin
- iOS平台,编译为Swift(HX 3.6.7+ 版本支持)
- 鸿蒙OS平台,编译为ets(HX 4.22+ 版本支持)在现有架构下,ets文件和js文件在同一环境下执行,不涉及类型、通讯等问题。
- 鸿蒙OS平台,编译为ArkTS(HX 4.22+ 版本支持)在现有架构下,ets文件和js文件在同一环境下执行,不涉及类型、通讯等问题。
uts 采用了与 ts 基本一致的语法规范,支持绝大部分 ES6 API。
......@@ -81,7 +81,9 @@ uts 插件编译到 app 平台时,在功能上相当于 uni-app 之前的 app
6. 插件市场的uts付费插件支持源码版销售和源码版权保护机制。而付费的原生语言插件不支持源码版销售。
7. uts插件可同时支持uni-app和uni-app x。
如果您是插件作者,可以了解更多uts插件和uni原生语言插件对插件作者的区别。[详见](https://uniapp.dcloud.net.cn/plugin/publish.html#utsdiff)
如果您是插件作者,可以了解更多uts插件和uni原生语言插件对插件作者的区别。[详见](https://uniapp.dcloud.net.cn/plugin/publish.html#utsdiff)
更新:“App原生语言插件”已停止维护。请插件开发者都使用uts插件。
### uts插件和Native.js的区别
......@@ -459,7 +461,7 @@ app-harmony文件夹存放uts插件编译到鸿蒙时的代码逻辑,目前仅
|目录名/文件名 |用途 |
|:--- |:--- |
|index.uts |主入口,interface.uts声明的能力在iOS平台下的实现 |
|index.uts |主入口,interface.uts声明的能力在harmony平台下的实现 |
## 开发uts插件
......@@ -467,13 +469,14 @@ app-harmony文件夹存放uts插件编译到鸿蒙时的代码逻辑,目前仅
#### 创建插件
在HBuilder X 中选中你的项目下 uni_modules目录,右键选择新建uni_modules插件, 例如 `uts-api`
在HBuilder X 中选中你的项目下`uni_modules`目录,右键选择新建uni_modules插件, 例如 `uts-api`
#### 编写interface.uts
插件 `uts-api` 创建完成后,我们需要确定插件对外暴露的 API。为了多端统一规范的定义对外暴露的接口,获得 HBuilder X更好的语法提示,我们建议在 `interface.uts` 文件中统一定义插件要暴露的 API 类型、 API 的参数类型、返回值类型、错误码类型、错误接口等信息,然后在各端的 `index.uts` 中做具体的业务实现。
插件 `uts-api` 创建完成后,我们需要确定插件对外暴露的 API。
为了多端统一规范的定义对外暴露的接口,获得更好的语法提示和多端一致性约束,标准做法是在 `interface.uts` 文件中统一定义插件要暴露的 API 类型、 API 的参数类型、返回值类型、错误码类型、错误接口等信息,然后在各端的 `index.uts` 中做具体的业务实现。
打开 `interface.uts` 文件,键入下面的源码, 为了方便说明,源码的每个部分的作用都用注释来说明。
......@@ -533,7 +536,7 @@ export type MyApiSync = (paramA : boolean) => MyApiResult
```
> 特别注意
> `interface.uts` 是我们推荐的做法,不做强制要求,可以根据自己的实际情况决定是否实现
> `interface.uts` 是官方推荐的多端一致性的最佳实践,不做强制要求,可以根据自己的实际情况决定是否实现。比如某个插件只有一个平台,不写interface也可以
> `interface.uts` 文件中定义并 `export` 的 `interface` 接口例如 `MyApiFail` 只能在插件内部的 `uts` 文件代码中使用,不能在 `.uvue` 文件中使用插件时导入使用。
至此,我们就完成了 `interface` 的定义,如果你遵循规范,定义了错误码的类型和错误码的 `interface``MyApiFail`, 那么你还需要在 `unierror.uts` 文件中对 `MyApiFail` 这个接口做具体实现。
......@@ -596,7 +599,7 @@ Uni错误规范的更多信息[详见](https://uniapp.dcloud.net.cn/tutorial/err
#### 实现接口定义和业务逻辑
分别在插件的 `app-android` `app-ios` 目录下打开 `index.uts` 文件,键入下面的插件源码:
分别在插件的 `app-android` `app-ios`目录下打开 `index.uts` 文件,键入下面的插件源码:
::: preview
......@@ -1414,7 +1417,7 @@ list1.forEach((item : any) => {
## 前端使用插件
虽然uts插件由uts语法开发,但前端引用插件并不要求一定需要ts,普通js即可引用uts插件
虽然uts插件由uts语法开发,但前端引用插件并不要求一定需要uts,普通js亦可引用uts插件。这也是uts插件同时支持uni-app和uni-app x的重要原因
下面介绍两种常见的引入方式
......@@ -1462,7 +1465,7 @@ getBatteryCapacity()
```
关于电量这个插件,插件市场已提供现成的插件,除了Android,还同时支持了web和小程序,可以去下载体验。[详见](https://ext.dcloud.net.cn/plugin?id=9295)
关于电量这个插件,插件市场已提供现成的插件,除了Android、iOS、鸿蒙,还同时支持了web和小程序,可以去下载体验。[详见](https://ext.dcloud.net.cn/plugin?id=9295)
更多开发示例,可以参考 [HelloUTS](https://gitcode.net/dcloud/hello-uts)
......
......@@ -4,7 +4,7 @@
上述概念,其实都是为了给组件一个标记,通过标记拿到组件的上下文对象,然后操作这个对象的方法。
但因为平台不同,制造了不同的概念。id在web和小程序中存在,ref是vue的概念。uni-app中这些皆而有之。
但因为平台不同,制造了不同的概念。id在web和小程序中存在,NodeRef是小程序的概念、ref和ComponentPublicInstance是vue的概念。uni-app中这些皆而有之。
我们以video为例,解释这些概念的相同和差别之处。
......@@ -20,10 +20,12 @@ html内置标签有id属性,通过document.getElmenetById("")可以返回一
```
### vue自定义组件@vuecomponent
vue框架中组件有ref属性,通过this.refs可以返回一个组件实例ComponentPublicInstance。可以进一步调用组件的方法。
vue框架中组件有ref属性,选项式中通过this.refs可以返回一个组件实例ComponentPublicInstance,组合式则是定义一个同名的ref()变量。得到组件实例可以进一步调用组件的属性和方法。
对于html内置元素,在web中一般不通过ref获取。ref更多是服务于自定义的vue组件。
但在uni-app x中,ref获取内置组件时,App和Web平台得到的是UniElement。获取非内置组件才是vue组件实例。
假使有一个vue组件,其有一个方法getSome(),那么用法是:\
template区:
```html
......@@ -57,6 +59,8 @@ uni.createVideoContext('vid').play()
}).exec()
```
一般推荐使用第1种方法,也就是createXXContext方式。这种方式简洁并且可以跨平台。
### vue自定义组件
uni-app编译到小程序时,vue组件的用法与web相同,具体[见上](#vuecomponent)
......@@ -81,7 +85,7 @@ uni-app x提供了[uni.getElementById](../api/get-element.md)方法,返回的
但是由于本方法不与页面绑定,获取的是栈顶页面的element,所以可能发生预期外的情况,[详见](../api/get-element.md)
UniVideoElement 继承自 Element,拥有video专用的一批方法。
UniVideoElement 继承自 UniElement,拥有video专用的一批方法。
template区:
```html
......@@ -106,7 +110,7 @@ uni-app x 虽然支持 `uni.createSelectorQuery()` API,传入选择器,可
其实`this.$refs`获取到的内置组件,通过as也可以转换为Element。
`uni.getElementById`相比,`this.$refs`方式与调用页面绑定,日常更推荐使用
`uni.getElementById`相比,`this.$refs`方式与调用页面绑定。
script区:
```js
......
......@@ -5,23 +5,26 @@
uts,全称 uni type script,是一门跨平台的、高性能的、强类型的现代编程语言。
它可以被编译为不同平台的编程语言,如:
- web平台,编译为JavaScript
- web平台/小程序,编译为JavaScript
- Android平台,编译为Kotlin
- iOS平台,编译Swift
- 鸿蒙OS平台,编译为ArkTS(HBuilderX 4.22+)
uts 采用了与 ts 基本一致的语法规范,支持绝大部分 ES6 API。
但为了跨端,uts进行了一些约束和特定平台的增补。
过去在js引擎下运行支持的语法,大部分在uts的处理下也可以平滑的在kotlin和swift中使用。但有一些无法抹平,需要使用条件编译。和uni-app的条件编译类似,uts也支持条件编译。写在条件编译里的,可以调用平台特有的扩展语法。
过去在js引擎下运行支持的语法,大部分在uts的处理下也可以平滑的在kotlin和swift中使用。但有一些无法抹平,需要使用条件编译。
和uni-app的条件编译类似,uts也支持条件编译。写在条件编译里的,可以调用平台特有的扩展语法。
### 用途和关系
uts是一门语言。也仅是一门语言,不包含ui框架。
uvue是DCloud提供的跨平台的、基于vue语法的ui框架。
uvue是DCloud提供的跨平台的、基于uts的、使用vue方式的ui框架。
uts相当于js,uvue相当于html和css。它们类似于v8和webkit的关系类似于dart和flutter的关系。
uts相当于js,uvue相当于html和css。它们类似于v8和webkit的关系,或者类似于dart和flutter的关系。
uts这门语言,有2个用途:
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册