From 79a46e2239d98ac654dd22d2efb60e66ef042343 Mon Sep 17 00:00:00 2001 From: git_robot Date: Mon, 12 Aug 2024 17:38:55 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20utsJson.json=E3=80=81utsAp?= =?UTF-8?q?iJson.json=E3=80=81utsComJson.json=E3=80=81utsUnicloudApiJson.j?= =?UTF-8?q?son=E3=80=81customTypeJson.json?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/.vuepress/utils/customTypeJson.json | 2 +- docs/.vuepress/utils/utsComJson.json | 2 +- docs/.vuepress/utils/utsUnicloudApiJson.json | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/.vuepress/utils/customTypeJson.json b/docs/.vuepress/utils/customTypeJson.json index c288be35..1ad6ef50 100644 --- a/docs/.vuepress/utils/customTypeJson.json +++ b/docs/.vuepress/utils/customTypeJson.json @@ -1 +1 @@ -{"UniKeyEvent":{"name":"## UniKeyEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniKeyEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniKeyEvent 的属性值 @unikeyevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| keyCode | number | 是 | - | - | - |\n| keyType | string | 是 | - | - | - |\n","compatibility":"### UniKeyEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniEvent":{"name":"## UniEvent","description":"","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件的名称 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件的名称 |\n| eventInit | any | 是 | - | - | 事件初始参数。支持字段:`bubbles`表明该事件是否冒泡。可选,默认为false;`cancelable`表明该事件是否可以被取消。可选,默认为false。 |\n\n### UniEvent 的属性值 @unievent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| bubbles | boolean | 是 | - | - | 是否冒泡 |\n| cancelable | boolean | 是 | - | - | 是否可以取消 |\n| type | string | 是 | - | - | 事件类型 |\n| target | [UniElement](/dom/unielement.md) | 否 | - | - | 触发事件的组件 |\n| currentTarget | [UniElement](/dom/unielement.md) | 否 | - | - | 当前组件 |\n| timeStamp | number | 是 | - | - | 事件发生时的时间戳 |\n","methods":{"stopPropagation":{"name":"#### stopPropagation(): void @stoppropagation","description":"阻止当前事件的进一步传播","compatibility":"##### stopPropagation 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"preventDefault":{"name":"#### preventDefault(): void @preventdefault","description":"阻止当前事件的默认行为\n","compatibility":"##### preventDefault 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | x |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniElement":{"name":"## UniElement","description":"UVUE DOM 元素对象,描述了 UVUE DOM 元素所普通具有的属性和方法。","extends":"","param":"\n### UniElement 的属性值 @unielement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| classList | Array\\ | 是 | - | | 只读属性 获取当前元素的的 class 属性的动态集合。 |\n| firstChild | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的的第一个子元素,如果元素是无子元素,则返回 null。 |\n| lastChild | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的最后一个子元素,如果没有子元素,则返回 null。 |\n| parentElement | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素在 DOM 树中的父元素,如果没有父元素(如未添加到DOM树中),则返回null。 |\n| previousSibling | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的前一个同级元素,没有则返回null。 |\n| nextElementSibling | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取在 DOM 树中紧跟在其后面的同级元素,如果指定的元素为最后一个元素,则返回 null。 |\n| children | Array\\<[UniElement](/dom/unielement.md)\\> | 是 | - | | 只读属性 获取当前元素包含的子元素的集合 |\n| tagName | string | 是 | - | | 只读属性 获取当前元素的标签名 |\n| nodeName | string | 是 | - | | 只读属性 获取当前元素的元素名称 |\n| dataset | Map\\ | 是 | - | | 只读属性 获取元素上自定义数据属性(data-*)的集合 |\n| attributes | Map\\ | 是 | - | | 只读属性 获取元素上所有属性元素的集合 |\n| style | [CSSStyleDeclaration](/dom/cssstyledeclaration.md) | 是 | - | | 只读属性 获取元素的CSS样式对象 |\n| scrollWidth | number | 是 | - | | 只读属性 获取可滚动元素内容的总宽度,仅scroll-view、list-view组件支持,其他组件返回视图宽度 |\n| scrollHeight | number | 是 | - | | 只读属性 获取可滚动元素内容的总高度,仅scroll-view、list-view组件支持,其他组件返回视图高度 |\n| scrollLeft | number | 是 | - | | 获取或修改元素滚动条到元素左边的距离像素数,仅scroll-view、list-view组件支持。其他组件返回0 |\n| scrollTop | number | 是 | - | | 获取或修改元素滚动条到元素顶部的距离像素数,仅scroll-view、list-view组件支持。其他组件返回0 |\n| offsetLeft | number | 是 | - | | 只读属性 元素的左边界偏移值 单位px |\n| offsetTop | number | 是 | - | | 只读属性 元素的顶部边界偏移值 单位px |\n| offsetWidth | number | 是 | - | | 只读属性 元素的布局宽度,宽度包含border、padding的数据值 单位px |\n| offsetHeight | number | 是 | - | | 只读属性 元素的布局高度,高度包含border、padding的数据值 单位px |\n| ext | Map\\ | 是 | - | | 只读属性 扩展属性 |\n","methods":{"takeSnapshot":{"name":"#### takeSnapshot(options: TakeSnapshotOptions): void @takesnapshot","description":"对当前组件进行截图,调用此方法会将当前组件(包含子节点)渲染结果导出成图片。\n成功会返回图片对应的临时文件路径,目前默认png格式\n","compatibility":"##### takeSnapshot 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| x | 3.93 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| options | **TakeSnapshotOptions** | 是 | - | - | 组件截图的参数对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| type | string | 否 | \"file\" | - | 截图导出类型,目前仅支持 'file' 保存到临时文件目录 |\n@| format | string | 否 | \"png\" | - | 截图文件格式,目前仅支持 'png' |\n@| success | (res: [TakeSnapshotSuccess](#takesnapshotsuccess-values)) => void | 否 | - | - | 接口调用成功的回调函数 |\n@| fail | (res: [TakeSnapshotFail](#takesnapshotfail-values)) => void | 否 | - | - | 接口调用失败的回调函数 |\n@| complete | (res: any) => void | 否 | - | - | 接口调用结束的回调函数(调用成功、失败都会执行) | \n\n###### TakeSnapshotSuccess 的属性值 @takesnapshotsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 |\n\n###### TakeSnapshotFail 的属性值 @takesnapshotfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errMsg | string | 是 | - | - | - |\n","returnValue":"","tutorial":""},"appendChild":{"name":"#### appendChild(aChild: UniElement): void @appendchild","description":"将一个元素添加到指定父元素的子元素列表的末尾处。如果将被插入的元素已经存在于当前文档的文档树中,那么将会它从原先的位置移动到新的位置。","compatibility":"##### appendChild 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| aChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 | \n","returnValue":"","tutorial":""},"insertBefore":{"name":"#### insertBefore(newChild: UniElement, refChild?: UniElement \\| null): UniElement \\| null @insertbefore","description":"在参考元素之前插入一个拥有指定父元素的子元素。如果给定的子元素是对文档中现有元素的引用,insertBefore() 会将其从当前位置移动到新位置。","compatibility":"##### insertBefore 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| newChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 |\n| refChild | [UniElement](/dom/unielement.md) | 否 | - | | 已存在父元素的子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"insertBefore_1":{"name":"#### insertBefore(newChild: UniElement): UniElement \\| null @insertbefore","description":"将一个元素添加到指定父元素的子元素列表的末尾处 功能等同于appendChild","compatibility":"##### insertBefore 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| newChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"setAttribute":{"name":"#### setAttribute(key: string, value: string): void @setattribute","description":"设置指定元素上的某个属性值。如果设置的属性已经存在,则更新该属性值;否则使用指定的名称和值添加一个新的属性。","compatibility":"##### setAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 |\n| value | string | 是 | - | - | 属性值域 | \n","returnValue":"","tutorial":""},"getAttribute":{"name":"#### getAttribute(key: string): string \\| null @getattribute","description":"获取元素指定的属性值,如果指定的属性不存在则返回null。","compatibility":"##### getAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| string | 否 |\n \n","tutorial":""},"hasAttribute":{"name":"#### hasAttribute(key: string): boolean @hasattribute","description":"返回改元素是否包含有指定的属性,属性存在则返回true,否则返回false。","compatibility":"##### hasAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"removeAttribute":{"name":"#### removeAttribute(key: string): void @removeattribute","description":"从元素中删除一个属性,如果指定的属性不存在,则不做任何操作,也不会产生错误。","compatibility":"##### removeAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"","tutorial":""},"getBoundingClientRect":{"name":"#### getBoundingClientRect(): DOMRect @getboundingclientrect","description":"获取元素的大小及其相对于窗口的位置信息。","compatibility":"##### getBoundingClientRect 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [DOMRect](/dom/domrect.md) | 一个 DOMRect 代表一个矩形。 |\n \n","tutorial":""},"getDrawableContext":{"name":"#### getDrawableContext(): DrawableContext \\| null @getdrawablecontext","description":"获取组件的绘制对象,仅uvue页面中的 view 组件支持,其它组件不支持则返回null。","compatibility":"##### getDrawableContext 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| x | 3.9 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [DrawableContext](/dom/drawablecontext.md) | 否 |\n \n","tutorial":""},"removeChild":{"name":"#### removeChild(aChild: UniElement): UniElement \\| null @removechild","description":"从元素中删除一个子元素,返回删除的元素。","compatibility":"##### removeChild 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| aChild | [UniElement](/dom/unielement.md) | 是 | - | | 被删除子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"remove":{"name":"#### remove(): void @remove","description":"把元素对象从它所属的 DOM 树中删除。","compatibility":"##### remove 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"scrollTo":{"name":"#### scrollTo(x: number, y: number): void @scrollto","description":"使界面滚动到给定元素的指定坐标位置 仅scroll-view、list-view组件支持","compatibility":"##### scrollTo 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | x轴要滚动到坐标位置(单位px) |\n| y | number | 是 | - | - | y轴要滚动到坐标位置(单位px) | \n","returnValue":"","tutorial":""},"scrollBy":{"name":"#### scrollBy(x: number, y: number): void @scrollby","description":"使得元素滚动一段特定距离 仅scroll-view、list-view组件支持","compatibility":"##### scrollBy 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | x轴要滚动的距离(单位px) |\n| y | number | 是 | - | - | y轴要滚动的距离(单位px) | \n","returnValue":"","tutorial":""},"querySelector":{"name":"#### querySelector(selector: string.cssSelectorString): UniElement \\| null @queryselector","description":"返回文档中与指定选择器或选择器组匹配的第一个 Element对象。如果找不到匹配项,则返回null","compatibility":"##### querySelector 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| selector | [string.cssSelectorString](/uts/data-type.md#ide-string) | 是 | - | - | CSS 选择器字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"querySelectorAll":{"name":"#### querySelectorAll(selector: string.cssSelectorString): UniElement[] \\| null @queryselectorall","description":"返回与指定的选择器组匹配的文档中的元素列表","compatibility":"##### querySelectorAll 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| selector | [string.cssSelectorString](/uts/data-type.md#ide-string) | 是 | - | - | CSS 选择器字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| Array\\<[UniElement](/dom/unielement.md)\\> | 否 |\n \n","tutorial":""},"focus":{"name":"#### focus(): void @focus","description":"使元素获取焦点 仅input、Textarea组件支持","compatibility":"##### focus 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"blur":{"name":"#### blur(): void @blur","description":"使元素丢失焦点 仅input、Textarea组件支持","compatibility":"##### blur 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"getIOSView":{"name":"#### getIOSView(): UIView \\| null @getiosview","description":"获取元素ios原生view","compatibility":"##### getIOSView 兼容性 \n| Web | Android | Android uni-app x UTS 插件 | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- | :- |\n| - | x | x | x | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| UIView | 否 |\n \n","tutorial":""},"getAndroidView":{"name":"#### getAndroidView(): View \\| null @getandroidview","description":"获取元素android原生view 可能返回null","compatibility":"##### getAndroidView 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| View | 否 |\n \n","tutorial":""},"getAndroidView_1":{"name":"#### getAndroidView\\(): T \\| null @getandroidview","description":"获取元素android原生view 通过泛型定义view类型 可能返回null","compatibility":"##### getAndroidView 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| T | 否 |\n \n","tutorial":""},"getAndroidActivity":{"name":"#### getAndroidActivity(): Activity \\| null @getandroidactivity","description":"获取元素android原生activity 可能返回null","compatibility":"##### getAndroidActivity 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| Activity | 否 |\n \n","tutorial":""}},"compatibility":"### UniElement 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.0 | 4.11 |"},"CSSStyleDeclaration":{"name":"## CSSStyleDeclaration","description":"CSSStyleDeclaration表示一个CSS 声明块对象,它是一个 CSS 属性键值对的集合,暴露样式信息和各种与样式相关的方法和属性。","extends":"","param":"","methods":{"setProperty":{"name":"#### setProperty(name: string \\| string.cssPropertyString, value: any \\| null): void @setproperty","description":"对CSS指定样式设置一个新值,如有此样式已存在则更新。","compatibility":"##### setProperty 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | CSS样式名称 |\n| value | any | 否 | - | - | 要设置的新CSS样式值 | \n","returnValue":"","tutorial":""},"getPropertyValue":{"name":"#### getPropertyValue(property: string \\| string.cssPropertyString): any \\| null @getpropertyvalue","description":"获取CSS指定的样式值,如果指定的样式不存在则返回null。","compatibility":"##### getPropertyValue 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| property | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | 要获取的CSS样式名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""},"removeProperty":{"name":"#### removeProperty(property: string \\| string.cssPropertyString): any \\| null @removeproperty","description":"删除CSS指定的样式值","compatibility":"##### removeProperty 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| property | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | 要删除的CSS样式名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""}},"compatibility":"### CSSStyleDeclaration 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |"},"TakeSnapshotOptions":{"name":"## TakeSnapshotOptions","description":"组件截图的参数配置选项","extends":"","param":"\n### TakeSnapshotOptions 的属性值 @takesnapshotoptions-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 否 | \"file\" | - | 截图导出类型,目前仅支持 'file' 保存到临时文件目录 |\n| format | string | 否 | \"png\" | - | 截图文件格式,目前仅支持 'png' |\n","methods":{"success":{"name":"#### (res: TakeSnapshotSuccess) => void @success","description":"接口调用成功的回调函数","compatibility":"##### success 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | **TakeSnapshotSuccess** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 | \n","returnValue":"","tutorial":""},"fail":{"name":"#### (res: TakeSnapshotFail) => void @fail","description":"接口调用失败的回调函数","compatibility":"##### fail 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | **TakeSnapshotFail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| errMsg | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"complete":{"name":"#### (res: any) => void @complete","description":"接口调用结束的回调函数(调用成功、失败都会执行)","compatibility":"##### complete 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | any | 是 | - | - | - | \n","returnValue":"","tutorial":""}},"compatibility":"### TakeSnapshotOptions 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotSuccessCallback":{"name":"## TakeSnapshotSuccessCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotSuccessCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotSuccess":{"name":"## TakeSnapshotSuccess","description":"","extends":"","param":"\n### TakeSnapshotSuccess 的属性值 @takesnapshotsuccess-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 |\n","compatibility":"### TakeSnapshotSuccess 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotFailCallback":{"name":"## TakeSnapshotFailCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotFailCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotFail":{"name":"## TakeSnapshotFail","description":"","extends":"","param":"\n### TakeSnapshotFail 的属性值 @takesnapshotfail-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errMsg | string | 是 | - | - | - |\n","compatibility":"### TakeSnapshotFail 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotCompleteCallback":{"name":"## TakeSnapshotCompleteCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotCompleteCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"DOMRect":{"name":"## DOMRect","description":"一个 DOMRect 代表一个矩形。","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 否 | 0 | - | 矩形原点的x坐标 |\n| y | number | 否 | 0 | - | 矩形原点的y坐标 |\n| width | number | 否 | 0 | - | 矩形的宽 |\n| height | number | 否 | 0 | - | 矩形的高 |\n\n### DOMRect 的属性值 @domrect-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | | 矩形的宽 |\n| height | number | 是 | - | | 矩形的高 |\n| x | number | 是 | - | | 矩形原点的x坐标 |\n| y | number | 是 | - | | 矩形原点的y坐标 |\n| left | number | 是 | - | | 矩形的左坐标值 |\n| right | number | 是 | - | | 矩形的右坐标值 |\n| top | number | 是 | - | | 矩形的顶坐标值 |\n| bottom | number | 是 | - | | 矩形的底坐标值 |\n","compatibility":"### DOMRect 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |"},"DrawableContext":{"name":"## DrawableContext","description":"","extends":"","param":"\n### DrawableContext 的属性值 @drawablecontext-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| font | string | 是 | 10px | | 设置字体大小 |\n| fillStyle | [string.ColorString](/uts/data-type.md#ide-string) | 是 | #000 (黑色) | | 设置填充颜色 |\n| lineCap | string | 是 | butt | | 指定如何绘制每一条线条末端的属性,可选值:`butt`线段末端以方形结束;`round`线段末端以圆形结束;`square`线段末端以方形结束,但是会增加一个一半宽度的矩形区域。 |\n| lineDashOffset | number | 是 | - | | 设置虚线偏移量 |\n| lineJoin | string | 是 | miter | | 设置 2 个长度不为 0 的线条相连部分如何连接在一起的属性,可选值:`bevel`斜角;`round`圆角;`miter`尖角。 |\n| lineWidth | number | 是 | 1px | | 设置线条的宽度 |\n| strokeStyle | [string.ColorString](/uts/data-type.md#ide-string) | 是 | #000 (黑色) | | 设置边框的颜色 |\n| textAlign | string | 是 | left | | 设置文本的对齐方式,可取值:`left`左对齐;`center`居中对齐;`right`右对齐。 |\n","methods":{"beginPath":{"name":"#### beginPath(): void @beginpath","description":"创建一个新的空路径","compatibility":"##### beginPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean \\| null): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆心的X轴坐标 |\n| y | number | 是 | - | - | 圆心的Y轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 否 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"将一个新的路径的起始点移动到 (x,y) 坐标","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 点的X轴坐标 |\n| y | number | 是 | - | - | 点的Y轴坐标 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"将路径的最后一个点连接到 (x,y) 坐标","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 线终点的X轴坐标 |\n| y | number | 是 | - | - | 线终点的Y轴坐标 | \n","returnValue":"","tutorial":""},"closePath":{"name":"#### closePath(): void @closepath","description":"闭合路径,将最后一个点与起点连接起来。如果图形已经封闭,或者只有一个点,那么此方法不会产生任何效果。","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"stroke":{"name":"#### stroke(): void @stroke","description":"绘制当前或已经存在的路径的边框。","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"strokeRect":{"name":"#### strokeRect(x: number, y: number, width: number, height: number): void @strokerect","description":"绘制一个矩形框","compatibility":"##### strokeRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"strokeText":{"name":"#### strokeText(text: string, x: number, y: number): void @stroketext","description":"绘制空心字符","compatibility":"##### strokeText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要绘制的字符 |\n| x | number | 是 | - | - | 字符开始绘制的X轴坐标 |\n| y | number | 是 | - | - | 字符开始绘制的Y轴坐标 | \n","returnValue":"","tutorial":""},"fill":{"name":"#### fill(fillRule?: string \\| null): void @fill","description":"填充当前或已存在的路径","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 否 | nonzero | - | 填充规则。可取值:`nonzero`非零环绕规则;`evenodd`奇偶环绕规则。 | \n","returnValue":"","tutorial":""},"fillRect":{"name":"#### fillRect(x: number, y: number, width: number, height: number): void @fillrect","description":"绘制一个实心矩形","compatibility":"##### fillRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"fillText":{"name":"#### fillText(text: string, x: number, y: number): void @filltext","description":"绘制实心字符","compatibility":"##### fillText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要绘制的字符 |\n| x | number | 是 | - | - | 字符开始绘制的X轴坐标 |\n| y | number | 是 | - | - | 字符开始绘制的Y轴坐标 | \n","returnValue":"","tutorial":""},"reset":{"name":"#### reset(): void @reset","description":"清空绘制数据","compatibility":"##### reset 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"update":{"name":"#### update(): void @update","description":"将所有绘制内容更新到画布上","compatibility":"##### update 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"setLineDash":{"name":"#### setLineDash(segments: Array\\): void @setlinedash","description":"设置虚线样式","compatibility":"##### setLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| segments | number[\\] | 是 | - | - | 一组描述交替绘制线段和间距长度的数字。 | \n","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"创建三次方贝塞尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个贝塞尔控制点的 x 坐标 |\n| cp1y | number | 是 | - | - | 第一个贝塞尔控制点的 y 坐标 |\n| cp2x | number | 是 | - | - | 第二个贝塞尔控制点的 x 坐标 |\n| cp2y | number | 是 | - | - | 第二个贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""}},"compatibility":"### DrawableContext 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/API/element-draw/element-draw.uvue) \n >\n> 该 API 不支持 Web,请运行 hello uni-app x 到 App 平台体验 \n```uvue\n\n\n\n\n\n\n```"},"UniCallbackWrapper":{"name":"## UniCallbackWrapper","description":"事件回调封装类,用于注销监听函数的形参","extends":"","param":"","compatibility":"### UniCallbackWrapper 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniMouseEvent":{"name":"## UniMouseEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniPointerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniMouseEvent 的属性值 @unimouseevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| x | number | 是 | - | - | 相对于页面可显示区域左边的距离,同`clientX` |\n| y | number | 是 | - | - | 相对于页面可显示区域顶部的距离,同`clientY` |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n","compatibility":"### UniMouseEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniCustomEvent":{"name":"## UniCustomEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniCustomEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| detail | T | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| options | any | 是 | - | - | - |\n\n### UniCustomEvent 的属性值 @unicustomevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | T | 是 | - | - | - |\n","compatibility":"### UniCustomEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniTouchEvent":{"name":"## UniTouchEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniTouchEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniTouchEvent 的属性值 @unitouchevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| touches | Array\\<**UniTouch**\\> | 是 | - | - | 当前停留在屏幕中的触摸点信息的数组 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n@| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n@| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n@| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n@| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n@| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n@| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n@| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n| changedTouches | Array\\<**UniTouch**\\> | 是 | - | - | 当前变化的触摸点信息的数组 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n@| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n@| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n@| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n@| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n@| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n@| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n@| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n","compatibility":"### UniTouchEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniTouch":{"name":"## UniTouch","description":"","extends":"","param":"\n### UniTouch 的属性值 @unitouch-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n","compatibility":"### UniTouch 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniPointerEvent":{"name":"## UniPointerEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniPointerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniPointerEvent 的属性值 @unipointerevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| x | number | 是 | - | - | 相对于页面可显示区域左边的距离,同`clientX` |\n| y | number | 是 | - | - | 相对于页面可显示区域顶部的距离,同`clientY` |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n","compatibility":"### UniPointerEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniObjectCustomEvent":{"name":"## UniObjectCustomEvent","description":"UniObject自定义事件","extends":"```mermaid\ngraph LR\n \nUniObjectCustomEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| detail | any | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n\n### UniObjectCustomEvent 的属性值 @uniobjectcustomevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件类型 |\n| detail | UTSJSONObject | 是 | - | - | - |\n","compatibility":"### UniObjectCustomEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | 4.25 | 4.25 |"},"UniImageElement":{"name":"## UniImageElement","description":"image元素对象","extends":"```mermaid\ngraph LR\n \nUniImageElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniImageElement 的属性值 @uniimageelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| src | string | 是 | - | | 图片url |\n","methods":{"onload":{"name":"#### onload(): void \\| null @onload","description":"图片加载完成事件","compatibility":"##### onload 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| - | 4.25 | 4.25 | x |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniImageElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniInputElement":{"name":"## UniInputElement","description":"input元素对象","extends":"```mermaid\ngraph LR\n \nUniInputElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniInputElement 的属性值 @uniinputelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| type | string | 是 | - | | input的类型 |\n| disabled | boolean | 是 | - | | 是否禁用 |\n| autofocus | boolean | 是 | - | | 自动获取焦点 |\n| value | string | 是 | - | | 输入框的初始内容 |\n","compatibility":"### UniInputElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | x |"},"UniTextareaElement":{"name":"## UniTextareaElement","description":"textarea元素对象","extends":"```mermaid\ngraph LR\n \nUniTextareaElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniTextareaElement 的属性值 @unitextareaelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| type | string | 是 | - | | input的类型 |\n| disabled | boolean | 是 | - | | 是否禁用 |\n| autofocus | boolean | 是 | - | | 自动获取焦点 |\n| value | string | 是 | - | | 输入框的初始内容 |\n","compatibility":"### UniTextareaElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniTextElement":{"name":"## UniTextElement","description":"text元素对象","extends":"```mermaid\ngraph LR\n \nUniTextElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniTextElement 的属性值 @unitextelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| value | string | 是 | - | | 只读属性 text元素的文案内容 |\n","methods":{"getTextExtra":{"name":"#### getTextExtra(): any \\| null @gettextextra","description":"","compatibility":"##### getTextExtra 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""}},"compatibility":"### UniTextElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniWebViewElement":{"name":"## UniWebViewElement","description":"web-view元素对象","extends":"```mermaid\ngraph LR\n \nUniWebViewElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"","methods":{"back":{"name":"#### back(): void @back","description":"后退","compatibility":"##### back 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"forward":{"name":"#### forward(): void @forward","description":"前进","compatibility":"##### forward 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"reload":{"name":"#### reload(): void @reload","description":"重新加载","compatibility":"##### reload 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"stop":{"name":"#### stop(): void @stop","description":"停止加载","compatibility":"##### stop 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"evalJS":{"name":"#### evalJS(js: string): void @evaljs","description":"原生和WebView通信(执行JS脚本)","compatibility":"##### evalJS 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| js | string | 是 | - | - | - | \n","returnValue":"","tutorial":""}},"compatibility":"### UniWebViewElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniVideoElement":{"name":"## UniVideoElement","description":"video元素对象","extends":"```mermaid\ngraph LR\n \nUniVideoElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"","methods":{"play":{"name":"#### play(): void @play","description":"播放","compatibility":"##### play 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"pause":{"name":"#### pause(): void @pause","description":"暂停","compatibility":"##### pause 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"seek":{"name":"#### seek(position: number): void @seek","description":"跳转到指定位置","compatibility":"##### seek 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| position | number | 是 | - | - | 跳转到指定位置(秒) | \n","returnValue":"","tutorial":""},"stop":{"name":"#### stop(): void @stop","description":"停止视频","compatibility":"##### stop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"sendDanmu":{"name":"#### sendDanmu(danmu: Danmu): void @senddanmu","description":"发送弹幕","compatibility":"##### sendDanmu 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| danmu | **Danmu** | 是 | - | - | 弹幕数据 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| text | string | 否 | - | - | 弹幕文字 |\n@| color | string | 否 | - | - | 弹幕颜色 |\n@| time | number | 否 | - | - | 显示时刻 | \n","returnValue":"","tutorial":""},"playbackRate":{"name":"#### playbackRate(rate: number): void @playbackrate","description":"设置倍速播放","compatibility":"##### playbackRate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| rate | number | 是 | - | - | 支持倍率 0.5/0.8/1.0/1.25/1.5 | \n","returnValue":"","tutorial":""},"requestFullScreen":{"name":"#### requestFullScreen(direction?: RequestFullScreenOptions \\| null): void @requestfullscreen","description":"进入全屏","compatibility":"##### requestFullScreen 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| direction | **RequestFullScreenOptions** | 否 | - | - | 0\\|正常竖向, 90\\|屏幕逆时针90度, -90\\|屏幕顺时针90度 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | number | 否 | - | - | direction |\n@@| 合法值 | 兼容性 | 描述 |\n@@| :- | :-: | :- |\n@@| 0 | - | 正常竖向 |\n@@| 90 | - | 屏幕逆时针90度 |\n@@| -90 | - | 屏幕顺时针90度 | \n","returnValue":"","tutorial":""},"exitFullScreen":{"name":"#### exitFullScreen(): void @exitfullscreen","description":"退出全屏","compatibility":"##### exitFullScreen 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniVideoElement 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"Danmu":{"name":"## Danmu","description":"","extends":"","param":"\n### Danmu 的属性值 @danmu-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 否 | - | - | 弹幕文字 |\n| color | string | 否 | - | - | 弹幕颜色 |\n| time | number | 否 | - | - | 显示时刻 |\n","compatibility":"### Danmu 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"RequestFullScreenOptions":{"name":"## RequestFullScreenOptions","description":"","extends":"","param":"\n### RequestFullScreenOptions 的属性值 @requestfullscreenoptions-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| direction | number | 否 | - | - | direction |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| 0 | - | 正常竖向 |\n@| 90 | - | 屏幕逆时针90度 |\n@| -90 | - | 屏幕顺时针90度 |\n","compatibility":"### RequestFullScreenOptions 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniCanvasElement":{"name":"## UniCanvasElement","description":"canvas元素对象","extends":"```mermaid\ngraph LR\n \nUniCanvasElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniCanvasElement 的属性值 @unicanvaselement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | | Canvas宽度 |\n| height | number | 是 | - | | Canvas高度 |\n","methods":{"getContext":{"name":"#### getContext(contentType: string): CanvasRenderingContext2D \\| null @getcontext","description":"返回 Canvas 的绘图上下文","compatibility":"##### getContext 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| contentType | string | 是 | - | - | - | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [CanvasRenderingContext2D](/api/canvasrenderingcontext2d.md) | 否 |\n \n","tutorial":""},"toBlob":{"name":"#### toBlob(callback: BlobCallback): void @toblob","description":"创造 Blob 对象","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | x | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toBlob_1":{"name":"#### toBlob(callback: BlobCallback, type: string): void @toblob","description":"","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - |\n| type | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toBlob_2":{"name":"#### toBlob(callback: BlobCallback, type: string, quality: number): void @toblob","description":"","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - |\n| type | string | 是 | - | - | - |\n| quality | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toDataURL":{"name":"#### toDataURL(type?: string \\| null, encoderOptions?: any \\| null): string @todataurl","description":"返回一个包含图片展示的 data URI (app平台不支持webp格式)","compatibility":"##### toDataURL 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 否 | - | - | |\n| encoderOptions | any | 否 | - | - | | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| string |\n \n","tutorial":""}},"compatibility":"### UniCanvasElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | 4.25 |"},"CanvasRenderingContext2D":{"name":"## CanvasRenderingContext2D","description":"canvas元素的绘图2D渲染上下文, 它用于绘制形状、文本、图像和其他对象","extends":"","param":"\n### CanvasRenderingContext2D 的属性值 @canvasrenderingcontext2d-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| canvas | [UniCanvasElement](/dom/unicanvaselement.md) | 是 | - | | 是对与给定上下文关联的HTMLCanvasElement对象的只读引用 |\n| direction | string | 是 | inherit | | 描述当前文本方向 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| ltr | - | - |\n@| rtl | - | - |\n@| inherit | - | - |\n| fillStyle | string | 是 | #000 (黑色) | | 设置填充颜色 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| interface | | - |\n@| string.ColorString | - | - |\n| filter | string | 是 | none | | 提供模糊、灰度等过滤效果的属性。它类似于 CSS filter 属性,并且接受相同的函数 |\n| font | string | 是 | 10px | | 设置字体大小 |\n| fontStretch | string | 是 | normal | | 指定绘制文本时字体如何被扩展或压缩。该属性对应于 CSS 中的 font-stretch 属性 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| ultra-condensed | - | - |\n@| extra-condensed | - | - |\n@| condensed | - | - |\n@| semi-condensed | - | - |\n@| normal | - | - |\n@| semi-expanded | - | - |\n@| expanded | - | - |\n@| extra-expanded | - | - |\n@| ultra-expanded | - | - |\n| globalAlpha | number | 是 | 1.0 | | 用来描述在 canvas 上绘图之前,设置图形和图片透明度的属性。数值的范围从 0.0(完全透明)到 1.0(完全不透明) |\n| globalCompositeOperation | string | 是 | source-over | | 在绘制新形状时应用的合成操作的类型,其中 type 是用于标识要使用的合成或混合模式操作的字符串 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| source-over | - | - |\n@| source-atop | - | - |\n@| source-in | - | - |\n@| source-out | - | - |\n@| destination-over | - | - |\n@| destination-atop | - | - |\n@| destination-in | - | - |\n@| destination-out | - | - |\n@| lighter | - | - |\n@| copy | - | - |\n@| xor | - | - |\n| imageSmoothingEnabled | boolean | 是 | true | | 用于设置是否对缩放后的图片进行平滑处理,true 表示进行平滑处理,false 表示不进行 |\n| imageSmoothingQuality | string | 是 | low | | 用于设置图像平滑度,要使此属性生效,imageSmoothingEnabled 属性必须为 true,可选值:`low`低质量; `medium`中等质量;`high`高质量。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| low | - | - |\n@| medium | - | - |\n@| high | - | - |\n| letterSpacing | string | 是 | 0px | | 用于指定绘制文本时字母之间的间距。这对应于 CSS 中的 letter-spacing 属性 |\n| lineCap | string | 是 | butt | | 指定如何绘制每一条线条末端的属性,可选值:`butt`线段末端以方形结束;`round`线段末端以圆形结束;`square`线段末端以方形结束,但是会增加一个一半宽度的矩形区域。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| butt | - | - |\n@| round | - | - |\n@| square | - | - |\n| lineDashOffset | number | 是 | 0.0 | | 设置虚线偏移量 |\n| lineJoin | string | 是 | miter | | 设置 2 个长度不为 0 的线条相连部分如何连接在一起的属性,可选值:`bevel`斜角;`round`圆角;`miter`尖角。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| round | - | - |\n@| bevel | - | - |\n@| miter | - | - |\n| lineWidth | number | 是 | 1.0 | | 设置线条的宽度, 零、负数、Infinity 和 NaN 值将被忽略 |\n| miterLimit | number | 是 | 10.0 | | 设置斜接面限制比例的属性。当获取属性值时,会返回当前的值。当给属性赋值时,0、负数、 Infinity 和 NaN 都会被忽略;除此之外都会被赋予一个新值。 |\n| shadowBlur | number | 是 | 0 | | 用于描述模糊效果程度,其中 0 表示没有模糊,数字越大表示模糊程度越高。这个值不对应于像素数量,并且不受当前变换矩阵的影响。负数、Infinity 和 NaN 将被忽略 |\n| shadowColor | string | 是 | fully-transparent black | | 描述阴影颜色,只有当 shadowColor 属性设置为非透明值时,阴影才会被绘制。其中的 shadowBlur、shadowOffsetX 或 shadowOffsetY 属性中至少有一个必须是非零的。 |\n| shadowOffsetX | number | 是 | 0 | | 指定阴影在水平方向上的偏移距离。正值向右偏移,负值向左偏移。默认值为 0(无水平偏移)。Infinity 和 NaN 值将被忽略 |\n| shadowOffsetY | number | 是 | 0 | | 指定阴影在垂直方向上的偏移距离。正值向右偏移,负值向左偏移。默认值为 0(无水平偏移)。Infinity 和 NaN 值将被忽略 |\n| strokeStyle | string | 是 | #000 (黑色) | | 设置边框的颜色 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| interface | | - |\n@| string.ColorString | - | - |\n| textAlign | string | 是 | left | | 设置文本的对齐方式,可取值:`left`左对齐;`center`居中对齐;`right`右对齐。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| left | - | - |\n@| right | - | - |\n@| center | - | - |\n@| start | - | - |\n@| end | - | - |\n| textBaseline | string | 是 | alphabetic | | 描述绘制文本时,当前文本基线的属性 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| top | - | - |\n@| hanging | - | - |\n@| middle | - | - |\n@| alphabetic | - | - |\n@| ideographic | - | - |\n@| bottom | - | - |\n| textRendering | string | 是 | auto | | 用于在渲染文本时向渲染引擎提供应该如何优化的相关信息 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| auto | - | - |\n@| optimizeSpeed | - | - |\n@| optimizeLegibility | - | - |\n@| geometricPrecision | - | - |\n| wordSpacing | string | 是 | 0px | | 用于指定绘制文本时单词之间的间距, 如果设置为无效或无法解析的值,则属性值将保持不变 |\n","methods":{"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆弧中心(圆心)的 x 轴坐标 |\n| y | number | 是 | - | - | 圆弧中心(圆心)的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 否 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"arcTo":{"name":"#### arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void @arcto","description":"根据控制点和半径绘制圆弧路径,使用当前的描点 (前一个 moveTo 或 lineTo 等函数的止点)。根据当前描点与给定的控制点 1 连接的直线,和控制点 1 与控制点 2 连接的直线,作为使用指定半径的圆的切线,画出两条切线之间的弧线路径","compatibility":"##### arcTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x1 | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| y1 | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| x2 | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| y2 | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 | \n","returnValue":"","tutorial":""},"beginPath":{"name":"#### beginPath(): void @beginpath","description":"开始创建一个路径。需要调用 fill 或者 stroke 才会使用路径进行填充或描边","compatibility":"##### beginPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"绘制三次贝赛尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| cp1y | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| cp2x | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| cp2y | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| x | number | 是 | - | - | 结束点的 x 轴坐标 |\n| y | number | 是 | - | - | 结束点的 y 轴坐标 | \n","returnValue":"","tutorial":""},"clearRect":{"name":"#### clearRect(x: number, y: number, width: number, height: number): void @clearrect","description":"清除画布上在该矩形区域内的内容","compatibility":"##### clearRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"clip":{"name":"#### clip(): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"clip_1":{"name":"#### clip(path: Path2D): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用 | \n","returnValue":"","tutorial":""},"clip_2":{"name":"#### clip(fillRule: string): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"clip_3":{"name":"#### clip(path: Path2D, fillRule: string): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用 |\n| fillRule | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"closePath":{"name":"#### closePath(): void @closepath","description":"关闭一个路径","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"createImageData":{"name":"#### createImageData(width: number, height: number): void @createimagedata","description":"创建一个新的、空白的、指定大小的 ImageData 对象。所有的像素在新对象中都是透明的黑色","compatibility":"##### createImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | - | - |\n| height | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"createPattern":{"name":"#### createPattern(image: Image, repetition: string): CanvasPattern @createpattern","description":"对指定的图像创建模式的方法,可在指定的方向上重复元图像","compatibility":"##### createPattern 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| image | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | 重复的图像源,支持代码包路径和本地临时路径 (本地路径) |\n| repetition | string | 是 | - | - | 如何重复图像 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| CanvasPattern | 接口表示一个不透明对象,描述了一个基于图像、画布或视频的模板,该模板通过 CanvasRenderingContext2D.createPattern() 方法创建 |\n \n","tutorial":""},"createLinearGradient":{"name":"#### createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient @createlineargradient","description":"创建一个线性的渐变颜色。返回的CanvasGradient对象需要使用 CanvasGradient.addColorStop() 来指定渐变点,至少要两个","compatibility":"##### createLinearGradient 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x0 | number | 是 | - | - | 起点的 x 坐标 |\n| y0 | number | 是 | - | - | 起点的 y 坐标 |\n| x1 | number | 是 | - | - | 终点的 x 坐标 |\n| y1 | number | 是 | - | - | 终点的 y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [CanvasGradient](#canvasgradient-values) | 表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回 |\n\n###### CanvasGradient 的方法 @canvasgradient-values \n\n###### addColorStop(stop: number, color: string): void @addcolorstop\n添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染\n###### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n\n##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n\n \n","tutorial":""},"createRadialGradient":{"name":"#### createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r01: number): CanvasGradient @createradialgradient","description":"根据参数确定两个圆的坐标,绘制放射性渐变。注意App平台和Web平台绘制效果有差异","compatibility":"##### createRadialGradient 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x0 | number | 是 | - | - | 开始圆形的 x 轴坐标 |\n| y0 | number | 是 | - | - | 开始圆形的 y 轴坐标 |\n| r0 | number | 是 | - | - | 开始圆形的半径 |\n| x1 | number | 是 | - | - | 结束圆形的 x 轴坐标 |\n| y1 | number | 是 | - | - | 结束圆形的 y 轴坐标 |\n| r01 | number | 是 | - | - | 结束圆形的半径 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [CanvasGradient](#canvasgradient-values) | 表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回 |\n\n###### CanvasGradient 的方法 @canvasgradient-values \n\n###### addColorStop(stop: number, color: string): void @addcolorstop\n添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染\n###### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n\n##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n\n \n","tutorial":""},"draw":{"name":"#### draw(): void @draw","description":"将之前在绘图上下文中的描述(路径、变形、样式)画到 canvas 中, 该操作为可选非web标准,canvas组件会自动选择合适时机进行绘制","compatibility":"##### draw 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"drawImage":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number): void @drawimage","description":"绘制图像到画布","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | 所要绘制的图片资源 |\n| sx | number | 是 | - | - | 需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 x 坐标 |\n| sy | number | 是 | - | - | 需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 y 坐标 | \n","returnValue":"","tutorial":""},"drawImage_1":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number, sWidth: number, sHeight: number): void @drawimage","description":"","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | image元素对象 |\n| sx | number | 是 | - | - | - |\n| sy | number | 是 | - | - | - |\n| sWidth | number | 是 | - | - | - |\n| sHeight | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"drawImage_2":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number, sWidth: number, sHeight: number, dx: number, dy: number, dWidth: number, dHeight: number): void @drawimage","description":"","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | image元素对象 |\n| sx | number | 是 | - | - | - |\n| sy | number | 是 | - | - | - |\n| sWidth | number | 是 | - | - | - |\n| sHeight | number | 是 | - | - | - |\n| dx | number | 是 | - | - | - |\n| dy | number | 是 | - | - | - |\n| dWidth | number | 是 | - | - | - |\n| dHeight | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"ellipse":{"name":"#### ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @ellipse","description":"添加椭圆路径。椭圆的圆心在(x,y)位置,半径分别是radiusX 和 radiusY,按照anticlockwise(默认顺时针)指定的方向,从 startAngle 开始绘制,到 endAngle 结束","compatibility":"##### ellipse 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 椭圆圆心的 x 轴(水平)坐标 |\n| y | number | 是 | - | - | 椭圆圆心的 y 轴(垂直)坐标 |\n| radiusX | number | 是 | - | - | 椭圆长轴的半径。必须为非负数 |\n| radiusY | number | 是 | - | - | 椭圆短轴的半径。必须为非负数。 |\n| rotation | number | 是 | - | - | 椭圆的旋转角度,以弧度表示。 |\n| startAngle | number | 是 | - | - | 椭圆弧的起始偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| endAngle | number | 是 | - | - | 椭圆弧的结束偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| anticlockwise | boolean | 是 | - | - | 一个可选的布尔值,如果为 true,则逆时针绘制椭圆弧。默认值为 false(顺时针)。 | \n","returnValue":"","tutorial":""},"fill":{"name":"#### fill(): void @fill","description":"对当前路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"fill_1":{"name":"#### fill(fillRule: \"nonzero\" \\| \"evenodd\"): void @fill","description":"对当前路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 是 | - | - | 填充当前或已存在的路径的方法。采取非零环绕(nonzero)或者奇偶环绕(evenodd)规则 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nonzero | - | - |\n@| evenodd | - | - | \n","returnValue":"","tutorial":""},"fill_2":{"name":"#### fill(path: Path2D): void @fill","description":"对指定路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | 填充路径 | \n","returnValue":"","tutorial":""},"fill_3":{"name":"#### fill(path: Path2D, fillRule: \"nonzero\" \\| \"evenodd\"): void @fill","description":"对指定路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | 填充路径 |\n| fillRule | string | 是 | - | - | 填充当前或已存在的路径的方法。采取非零环绕(nonzero)或者奇偶环绕(evenodd)规则 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nonzero | - | - |\n@| evenodd | - | - | \n","returnValue":"","tutorial":""},"fillRect":{"name":"#### fillRect(x: number, y: number, width: number, height: number): void @fillrect","description":"填充一个矩形。用 setFillStyle 设置矩形的填充色,如果没设置默认是黑色","compatibility":"##### fillRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"fillText":{"name":"#### fillText(text: string, x: number, y: number, maxWidth?: number): void @filltext","description":"在画布上绘制文本","compatibility":"##### fillText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲染的文本字符串 |\n| x | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| y | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| maxWidth | number | 否 | - | - | 需要绘制的最大宽度 | \n","returnValue":"","tutorial":""},"getImageData":{"name":"#### getImageData(sx: number, sy: number, sw: number, sh: number): ImageData @getimagedata","description":"返回一个ImageData对象,用来描述 canvas 区域隐含的像素数据,这个区域通过矩形表示,起始点为*(sx, sy)、宽为sw、高为sh。","compatibility":"##### getImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| sx | number | 是 | - | - | 将要被提取的图像数据矩形区域的左上角 x 坐标 |\n| sy | number | 是 | - | - | 将要被提取的图像数据矩形区域的左上角 y 坐标 |\n| sw | number | 是 | - | - | 将要被提取的图像数据矩形区域的宽度 |\n| sh | number | 是 | - | - | 将要被提取的图像数据矩形区域的高度 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| **ImageData** | 描述canvas元素的一个隐含像素数据的区域 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - | \n","tutorial":""},"isContextLost":{"name":"#### isContextLost(): Boolean @iscontextlost","description":"返回一个Boolean 标记上下文是否已经丢失","compatibility":"##### isContextLost 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| Boolean |\n \n","tutorial":""},"isPointInPath":{"name":"#### isPointInPath(x: number, y: number): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_1":{"name":"#### isPointInPath(x: number, y: number, fillRule: string): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 |\n| fillRule | string | 是 | - | - | 用来决定点在路径内还是在路径外的算法 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_2":{"name":"#### isPointInPath(path: Path2D, x: number, y: number): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_3":{"name":"#### isPointInPath(path: Path2D, x: number, y: number, fillRule: string): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 |\n| fillRule | string | 是 | - | - | 用来决定点在路径内还是在路径外的算法 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInStroke":{"name":"#### isPointInStroke(x: number, y: number): boolean @ispointinstroke","description":"检测某点是否在路径的描边线","compatibility":"##### isPointInStroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInStroke_1":{"name":"#### isPointInStroke(path: Path2D, x: number, y: number): boolean @ispointinstroke","description":"检测某点是否在路径的描边线","compatibility":"##### isPointInStroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"getLineDash":{"name":"#### getLineDash(): Array\\ @getlinedash","description":"在填充线时使用虚线模式, 它使用一组值来指定描述模式的线和间隙的交替长度。注意App平台和Web平台绘制效果有差异","compatibility":"##### getLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| number[\\] |\n \n","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"增加一个新点,然后创建一条从上次指定点到目标点的线。用 stroke 方法来画线条","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 目标位置的 x 坐标 |\n| y | number | 是 | - | - | 目标位置的 y 坐标 | \n","returnValue":"","tutorial":""},"measureText":{"name":"#### measureText(text: string): TextMetrics @measuretext","description":"测量文本尺寸信息。目前仅返回文本宽度","compatibility":"##### measureText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲测量的文本字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| **TextMetrics** | 表示文本的尺寸,通过 CanvasRenderingContext2D.measureText() 方法创建 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| width | number | 是 | - | - | - | \n","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"把路径移动到画布中的指定点","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 目标位置的 x 坐标 |\n| y | number | 是 | - | - | 目标位置的 y 坐标 | \n","returnValue":"","tutorial":""},"putImageData":{"name":"#### putImageData(imageData: ImageData, x: number, y: number): boolean @putimagedata","description":"将数据从已有的 ImageData 对象绘制到位图的方法。如果提供了一个绘制过的矩形,则只绘制该矩形的像素。此方法不受画布转换矩阵的影响","compatibility":"##### putImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageData | **ImageData** | 是 | - | | 包含像素值的数组对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - |\n| x | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(x 轴方向的偏移量) |\n| y | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(y 轴方向的偏移量) | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"putImageData_1":{"name":"#### putImageData(imageData: ImageData, x: number, y: number, dirtyX: number, dirtyY: number, dirtyWidth: number, dirtyHeight: number): boolean @putimagedata","description":"将数据从已有的 ImageData 对象绘制到位图的方法。如果提供了一个绘制过的矩形,则只绘制该矩形的像素。此方法不受画布转换矩阵的影响","compatibility":"##### putImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageData | **ImageData** | 是 | - | | 包含像素值的数组对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - |\n| x | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(x 轴方向的偏移量) |\n| y | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(y 轴方向的偏移量) |\n| dirtyX | number | 是 | - | - | 在源图像数据中,矩形区域左上角的位置。默认是整个图像数据的左上角(x 坐标) |\n| dirtyY | number | 是 | - | - | 在源图像数据中,矩形区域左上角的位置。默认是整个图像数据的左上角(y 坐标) |\n| dirtyWidth | number | 是 | - | - | 在源图像数据中,矩形区域的宽度。默认是图像数据的宽度) |\n| dirtyHeight | number | 是 | - | - | 在源图像数据中,矩形区域的高度。默认是图像数据的高度 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"quadraticCurveTo":{"name":"#### quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void @quadraticcurveto","description":"创建二次贝塞尔曲线路径","compatibility":"##### quadraticCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cpx | number | 是 | - | - | 贝塞尔控制点的 x 坐标 |\n| cpy | number | 是 | - | - | 贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形路径起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形路径起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形路径的宽度 |\n| height | number | 是 | - | - | 矩形路径的高度 | \n","returnValue":"","tutorial":""},"resetTransform":{"name":"#### resetTransform(): void @resettransform","description":"使用单位矩阵重新设置当前变换","compatibility":"##### resetTransform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"restore":{"name":"#### restore(): void @restore","description":"恢复之前保存的绘图上下文","compatibility":"##### restore 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"rotate":{"name":"#### rotate(rotate: number): void @rotate","description":"以原点为中心顺时针旋转当前坐标轴","compatibility":"##### rotate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| rotate | number | 是 | - | - | ,以弧度计 degrees * Math.PI/180;degrees 范围为 0-360 | \n","returnValue":"","tutorial":""},"roundRect":{"name":"#### roundRect(x: number, y: number, width: number, height: number, radii: any): boolean @roundrect","description":"在当前路径中添加一个圆角矩形","compatibility":"##### roundRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 包含像素值的数组对象 |\n| y | number | 是 | - | - | 矩形起点的 x 轴坐标,以像素为单位 |\n| width | number | 是 | - | - | 矩形起点的 y 轴坐标,以像素为单位 |\n| height | number | 是 | - | - | 矩形的宽度。正值向右,负值向左 |\n| radii | any | 是 | - | - | 矩形的高度。正值向下,负值向上 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"save":{"name":"#### save(): void @save","description":"保存绘图上下文","compatibility":"##### save 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"scale":{"name":"#### scale(x: number, y: number): void @scale","description":"缩放变换","compatibility":"##### scale 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | |\n| y | number | 是 | - | - | | \n","returnValue":"","tutorial":""},"setLineDash":{"name":"#### setLineDash(segments: Array\\): void @setlinedash","description":"在填充线时使用虚线模式, 它使用一组值来指定描述模式的线和间隙的交替长度。","compatibility":"##### setLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| segments | number[\\] | 是 | - | - | \\一组描述交替绘制线段和间距(坐标空间单位)长度的数字 | \n","returnValue":"","tutorial":""},"setTransform":{"name":"#### setTransform(scaleX: Number, skewY: Number, skewX: Number, scaleY: Number, translateX: Number, translateY: Number): void @settransform","description":"使用单位矩阵重新设置(覆盖)当前的变换并调用变换","compatibility":"##### setTransform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| scaleX | Number | 是 | - | - | 水平缩放 |\n| skewY | Number | 是 | - | - | 垂直倾斜 |\n| skewX | Number | 是 | - | - | 水平倾斜 |\n| scaleY | Number | 是 | - | - | 垂直缩放 |\n| translateX | Number | 是 | - | - | 水平移动 |\n| translateY | Number | 是 | - | - | 垂直移动 | \n","returnValue":"","tutorial":""},"stroke":{"name":"#### stroke(): void @stroke","description":"画出当前路径的边框。默认颜色色为黑色","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"stroke_1":{"name":"#### stroke(path: Path2D): void @stroke","description":"画出指定路径的边框。默认颜色色为黑色","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | | \n","returnValue":"","tutorial":""},"strokeRect":{"name":"#### strokeRect(x: number, y: number, width: number, height: number): void @strokerect","description":"画一个矩形(非填充)","compatibility":"##### strokeRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"strokeText":{"name":"#### strokeText(text: string, x: number, y: number, maxWidth?: number): void @stroketext","description":"文本描边","compatibility":"##### strokeText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲染的文本字符串 |\n| x | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| y | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| maxWidth | number | 否 | - | - | 需要绘制的最大宽度 | \n","returnValue":"","tutorial":""},"transform":{"name":"#### transform(scaleX: Number, skewY: number, skewX: number, scaleY: number, translateX: number, translateY: number): void @transform","description":"使用矩阵多次叠加当前变换,矩阵由方法的参数进行描述。可以缩放、旋转、移动和倾斜上下文","compatibility":"##### transform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| scaleX | Number | 是 | - | - | 水平缩放 |\n| skewY | number | 是 | - | - | 垂直倾斜 |\n| skewX | number | 是 | - | - | 水平倾斜 |\n| scaleY | number | 是 | - | - | 垂直缩放 |\n| translateX | number | 是 | - | - | 水平移动 |\n| translateY | number | 是 | - | - | 垂直移动 | \n","returnValue":"","tutorial":""},"translate":{"name":"#### translate(translateX: number, translateY: number): void @translate","description":"当前网格添加平移变换","compatibility":"##### translate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| translateX | number | 是 | - | - | 水平方向的移动距离 |\n| translateY | number | 是 | - | - | 垂直方向的移动距离 | \n","returnValue":"","tutorial":""}},"compatibility":"### CanvasRenderingContext2D 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"CanvasGradient":{"name":"## CanvasGradient","description":"表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回","extends":"","param":"","methods":{"addColorStop":{"name":"#### addColorStop(stop: number, color: string): void @addcolorstop","description":"添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染","compatibility":"##### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n","returnValue":"","tutorial":""}},"compatibility":"### CanvasGradient 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"Path2D":{"name":"## Path2D","description":"Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用","extends":"","param":"","methods":{"closePath":{"name":"#### closePath(): void @closepath","description":"闭合路径,将最后一个点与起点连接起来。如果图形已经封闭,或者只有一个点,那么此方法不会产生任何效果。","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"将一个新的路径的起始点移动到 (x,y) 坐标","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 点的X轴坐标 |\n| y | number | 是 | - | - | 点的Y轴坐标 | \n","returnValue":"","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"将路径的最后一个点连接到 (x,y) 坐标","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 线终点的X轴坐标 |\n| y | number | 是 | - | - | 线终点的Y轴坐标 | \n","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"创建三次方贝塞尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个贝塞尔控制点的 x 坐标 |\n| cp1y | number | 是 | - | - | 第一个贝塞尔控制点的 y 坐标 |\n| cp2x | number | 是 | - | - | 第二个贝塞尔控制点的 x 坐标 |\n| cp2y | number | 是 | - | - | 第二个贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"quadraticCurveTo":{"name":"#### quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void @quadraticcurveto","description":"创建二次贝塞尔曲线路径","compatibility":"##### quadraticCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cpx | number | 是 | - | - | 贝塞尔控制点的 x 坐标 |\n| cpy | number | 是 | - | - | 贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆弧中心(圆心)的 x 轴坐标 |\n| y | number | 是 | - | - | 圆弧中心(圆心)的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 是 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"arcTo":{"name":"#### arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void @arcto","description":"根据控制点和半径绘制圆弧路径,使用当前的描点 (前一个 moveTo 或 lineTo 等函数的止点)。根据当前描点与给定的控制点 1 连接的直线,和控制点 1 与控制点 2 连接的直线,作为使用指定半径的圆的切线,画出两条切线之间的弧线路径","compatibility":"##### arcTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x1 | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| y1 | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| x2 | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| y2 | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 | \n","returnValue":"","tutorial":""},"ellipse":{"name":"#### ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @ellipse","description":"添加椭圆路径。椭圆的圆心在(x,y)位置,半径分别是radiusX 和 radiusY,按照anticlockwise(默认顺时针)指定的方向,从 startAngle 开始绘制,到 endAngle 结束","compatibility":"##### ellipse 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 椭圆圆心的 x 轴(水平)坐标 |\n| y | number | 是 | - | - | 椭圆圆心的 y 轴(垂直)坐标 |\n| radiusX | number | 是 | - | - | 椭圆长轴的半径。必须为非负数 |\n| radiusY | number | 是 | - | - | 椭圆短轴的半径。必须为非负数。 |\n| rotation | number | 是 | - | - | 椭圆的旋转角度,以弧度表示。 |\n| startAngle | number | 是 | - | - | 椭圆弧的起始偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| endAngle | number | 是 | - | - | 椭圆弧的结束偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| anticlockwise | boolean | 是 | - | - | 一个可选的布尔值,如果为 true,则逆时针绘制椭圆弧。默认值为 false(顺时针)。 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形路径起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形路径起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形路径的宽度 |\n| height | number | 是 | - | - | 矩形路径的高度 | \n","returnValue":"","tutorial":""}},"compatibility":"### Path2D 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |"},"CanvasPattern":{"name":"## CanvasPattern","description":"接口表示一个不透明对象,描述了一个基于图像、画布或视频的模板,该模板通过 CanvasRenderingContext2D.createPattern() 方法创建","extends":"","param":"","compatibility":"### CanvasPattern 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"ImageData":{"name":"## ImageData","description":"描述canvas元素的一个隐含像素数据的区域","extends":"","param":"\n### ImageData 的属性值 @imagedata-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n| width | number | 是 | - | - | - |\n| height | number | 是 | - | - | - |\n","compatibility":"### ImageData 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"TextMetrics":{"name":"## TextMetrics","description":"表示文本的尺寸,通过 CanvasRenderingContext2D.measureText() 方法创建","extends":"","param":"\n### TextMetrics 的属性值 @textmetrics-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | - | - |\n","compatibility":"### TextMetrics 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"UniResizeObserver":{"name":"## UniResizeObserver","description":"用于监视 UniElement 元素的大小变化。它可以观察一个或多个","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | (entries: Array\\<**UniResizeObserverEntry**\\>) => void | 是 | - | - | 每当监视的元素调整大小时,回调该函数 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n@| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n@| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n@| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n@| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | (entries: Array\\<**UniResizeObserverEntry**\\>, observer: [UniResizeObserver](/dom/uniresizeobserver.md)) => void | 是 | - | - | 每当监视的元素调整大小时,回调该函数 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n@| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n@| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n@| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n@| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n","methods":{"disconnect":{"name":"#### disconnect(): void @disconnect","description":"取消所有的对 UniElement 目标的监视","compatibility":"##### disconnect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"observe":{"name":"#### observe(target: UniElement): void @observe","description":"监视指定 UniElement 大小变化","compatibility":"##### observe 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| target | [UniElement](/dom/unielement.md) | 是 | - | | 被监视的 UniElement | \n","returnValue":"","tutorial":""},"unobserve":{"name":"#### unobserve(target: UniElement): void @unobserve","description":"结束对指定的 UniElement 的监视","compatibility":"##### unobserve 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| target | [UniElement](/dom/unielement.md) | 是 | - | | 取消监视的 UniElement | \n","returnValue":"","tutorial":""}},"compatibility":"### UniResizeObserver 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/API/resize-observer/resize-observer.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/API/resize-observer/resize-observer\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\r\n export default {\r\n data() {\r\n return {\r\n outBoxSizeInfo: \"\",\r\n innerBoxSizeInfo: \"\",\r\n offset: 2,\r\n boxDisplay: false,\r\n outBoxElement: null as UniElement | null,\r\n innerBoxElement: null as UniElement | null,\r\n resizeObserver: null as UniResizeObserver | null,\r\n outBoxElementOnResize: false\r\n }\r\n },\r\n onBackPress() : boolean {\r\n if (this.resizeObserver != null) {\r\n this.resizeObserver!.disconnect()\r\n }\r\n return false\r\n },\r\n onReady() {\r\n if (this.resizeObserver == null) {\r\n this.resizeObserver = new UniResizeObserver((entries : Array) => {\r\n\r\n entries.forEach(entry => {\r\n if (entry.target == this.outBoxElement) {\r\n this.outBoxSizeInfo = this.analysisResizeObserverEntry(entry)\r\n this.outBoxElementOnResize = true\r\n } else if (entry.target == this.innerBoxElement) {\r\n this.innerBoxSizeInfo = this.analysisResizeObserverEntry(entry)\r\n }\r\n })\r\n })\r\n this.outBoxElement = uni.getElementById(\"outBox\")\r\n if (this.outBoxElement != null) {\r\n this.resizeObserver!.observe(this.outBoxElement!)\r\n }\r\n this.innerBoxElement = uni.getElementById(\"innerBox\")\r\n if (this.innerBoxElement != null) {\r\n this.resizeObserver!.observe(this.innerBoxElement!)\r\n }\r\n this.boxDisplay = true\r\n }\r\n },\r\n methods: {\r\n innerBoxClick() {\r\n if (this.innerBoxElement != null) {\r\n this.innerBoxElement!.style.setProperty(\"width\", this.innerBoxElement!.offsetWidth + this.offset + 'px')\r\n this.innerBoxElement!.style.setProperty(\"height\", this.innerBoxElement!.offsetWidth + this.offset + 'px')\r\n }\r\n },\r\n outBoxClick() {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElement!.style.setProperty(\"width\", this.outBoxElement!.offsetWidth + this.offset + 'px')\r\n this.outBoxElement!.style.setProperty(\"height\", this.outBoxElement!.offsetWidth + this.offset + 'px')\r\n }\r\n },\r\n revertBoxSize() {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElement!.style.setProperty(\"width\", \"140px\")\r\n this.outBoxElement!.style.setProperty(\"height\", \"140px\")\r\n }\r\n if (this.innerBoxElement != null) {\r\n this.innerBoxElement!.style.setProperty(\"width\", \"80px\")\r\n this.innerBoxElement!.style.setProperty(\"height\", \"80px\")\r\n }\r\n },\r\n //自动化测试专用\r\n setOutBoxMarginLeft(value : string) {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElementOnResize = false\r\n this.outBoxElement!.style.setProperty(\"margin-left\", value)\r\n }\r\n },\r\n toggleDisplay() {\r\n this.boxDisplay = !this.boxDisplay\r\n },\r\n analysisResizeObserverEntry(entry : UniResizeObserverEntry) : string {\r\n const contentBoxSize = entry.contentBoxSize[0]\r\n const borderBoxSize = entry.borderBoxSize[0]\r\n const devicePixelContentBoxSize = entry.devicePixelContentBoxSize[0]\r\n return \"borderBoxSize: \\n{blockSize:\" + borderBoxSize.blockSize + \", inlineSize:\" + borderBoxSize.inlineSize + \"}\\n\" +\r\n \"contentBoxSize: \\n{blockSize:\" + contentBoxSize.blockSize + \", inlineSize:\" + contentBoxSize.inlineSize + \"}\\n\" +\r\n \"devicePixelContentBoxSize: \\n{blockSize:\" + devicePixelContentBoxSize.blockSize + \", inlineSize:\" + devicePixelContentBoxSize.inlineSize + \"}\\n\" +\r\n \"contentRect: \\n{x:\" + entry.contentRect.x + \", y:\" + entry.contentRect.y + \", width:\" + entry.contentRect.width + \", height:\" + entry.contentRect.height + \"}\"\r\n },\n cancelListen(){\n // this.resizeObserver?.unobserve()\n this.resizeObserver!.unobserve(this.outBoxElement!)\n this.resizeObserver!.unobserve(this.innerBoxElement!)\n },\n goOnListen(){\n this.resizeObserver!.observe(this.outBoxElement!)\n this.resizeObserver!.observe(this.innerBoxElement!)\n }\r\n }\r\n }\r\n\n```\n:::"},"UniResizeObserverEntry":{"name":"## UniResizeObserverEntry","description":"UniResizeObserverEntry 接口是传递给 UniResizeObserver() 构造函数中的回调函数参数的对象","extends":"","param":"\n### UniResizeObserverEntry 的属性值 @uniresizeobserverentry-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n","compatibility":"### UniResizeObserverEntry 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniBorderBoxSize":{"name":"## UniBorderBoxSize","description":"被监视的元素带有边框box的大小","extends":"","param":"\n### UniBorderBoxSize 的属性值 @uniborderboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n","compatibility":"### UniBorderBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniContentBoxSize":{"name":"## UniContentBoxSize","description":"被监视的元素内容box的大小","extends":"","param":"\n### UniContentBoxSize 的属性值 @unicontentboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n","compatibility":"### UniContentBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniDevicePixelContentBoxSize":{"name":"## UniDevicePixelContentBoxSize","description":"被监视的元素内容box的设备像素大小","extends":"","param":"\n### UniDevicePixelContentBoxSize 的属性值 @unidevicepixelcontentboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n","compatibility":"### UniDevicePixelContentBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniError":{"name":"## UniError","description":"uni api统一错误信息对象 ","extends":"","param":"\n### 构造函数\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | 统一错误描述信息 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | 统一错误描述信息 |\n| options | any | 是 | - | - | 源错误对象,原始错误对象应该包含在 options.cause 属性中 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errSubject | string | 是 | - | - | 统一错误主题(模块)名称 |\n| errCode | number | 是 | - | - | 统一错误码 |\n| errMsg | string | 是 | - | - | 统一错误描述信息 |\n\n### UniError 的属性值 @unierror-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errSubject | string | 是 | - | - | 统一错误主题(模块)名称 |\n| errCode | number | 是 | - | - | 统一错误码 |\n| errMsg | string | 是 | - | - | 统一错误描述信息 |\n| data | any | 否 | - | - | 错误信息中包含的数据 |\n| cause | [Error](https://uniapp.dcloud.net.cn/tutorial/err-spec.html#unierror) | 否 | - | - | 源错误信息,可以包含多个错误,详见SourceError |\n| name | string | 是 | - | - | - |\n| message | string | 是 | - | - | - |\n","compatibility":"### UniError 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"Error":{"name":"## Error","description":"UTS错误信息对象","extends":"","param":"\n### 构造函数\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | - |\n| options | any | 是 | - | - | - |\n\n### Error 的属性值 @error-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | - | - |\n| message | string | 是 | - | - | - |\n| cause | [Error](https://uniapp.dcloud.net.cn/tutorial/err-spec.html#unierror) | 否 | - | - | - |\n","compatibility":"### Error 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniProvider":{"name":"## UniProvider","description":"服务供应商","extends":"","param":"\n### UniProvider 的属性值 @uniprovider-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| id | string | 是 | - | - | 服务供应商标识 |\n| description | string | 是 | - | - | 服务供应商描述 |\n| ~~isAppExist~~ | boolean | 是 | - | - | 判断服务供应商依赖的App是否安装(仅支持微信支付) |\n","compatibility":"### UniProvider 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | 4.18 | 4.18 |"},"general-attribute":{"name":"组件公共属性","description":"","attribute":"| 名称 | 类型 | 描述 |\n| :- | :- | :- |\n| id | string(string.IDString) | 组件的唯一标识。需避免同页面中不同组件设置重复id;需避免使用uni-、uni.等前缀 |\n| style | string | 组件的内联样式,可以动态设置的内联样式 |\n| class | string(string.ClassString) | 组件的样式类,在对应的 css 中定义的样式类 |\n| ref | string | vue中组件的唯一标识,用来给子组件注册引用信息,[详见](https://doc.dcloud.net.cn/uni-app-x/vue/built-in.html#ref) |\n| data-* | any | 自定义属性,组件上触发的事件时,会发送给事件处理函数 |\n| android-* | any | App-Android平台专有属性,详见[App-Android平台专有属性](https://doc.dcloud.net.cn/uni-app-x/component/common.html#attribute-android)章节 |","compatibility":"| | Web | Android | iOS |\n| :- | :- | :- | :- |\n| id | 4.0 | 3.9 | 4.11 |\n| style | 4.0 | 3.9 | 4.11 |\n| class | 4.0 | 3.9 | 4.11 |\n| ref | 4.0 | 3.9 | 4.11 |\n| data-* | 4.0 | 3.9 | 4.11 |\n| android-* | x | 3.9 | x |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/global-properties/global-properties.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/global-properties/global-properties\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\nexport default {\n data() {\n return {\n title: 'global-properties',\n generalId: 'general-id',\n generalClass: 'general-class',\n generalName: 'general-name',\n generalTitle: 'general-title',\n generalData: 'general-data',\n generalStyle: 'background-color: aqua',\n validateGeneralAttrText: '验证基础属性',\n hoverClass: 'hover-class',\n validateViewAttrText: '验证 view 属性',\n changeHeightByRefText: '通过 ref 修改高度',\n }\n },\n methods: {\n validateGeneralAttributes() {\n const generalTarget = this.$refs['general-target'] as UniElement\n const generalId = generalTarget.getAttribute('id')\n if (generalId != this.generalId) {\n this.validateGeneralAttrText = '基础属性 id 验证失败'\n return\n }\n // #ifdef APP\n if (!generalTarget.classList.includes('general-class')) {\n // #endif\n // #ifdef WEB\n if (!Array.from(generalTarget.classList).includes('general-class')) {\n // #endif\n this.validateGeneralAttrText = '基础属性 class 验证失败'\n return\n }\n const generalName = generalTarget.getAttribute('name')\n if (generalName != this.generalName) {\n this.validateGeneralAttrText = '基础属性 name 验证失败'\n return\n }\n const generalTitle = generalTarget.getAttribute('title')\n if (generalTitle != this.generalTitle) {\n this.validateGeneralAttrText = '基础属性 title 验证失败'\n return\n }\n const generalData = generalTarget.getAttribute('data-test')\n if (generalData != this.generalData) {\n this.validateGeneralAttrText = '基础属性 data-test 验证失败'\n return\n }\n this.validateGeneralAttrText = '基础属性验证成功'\n },\n changeHeight(){\n const generalTarget = this.$refs['general-target'] as UniElement\n this.changeHeightByRefText = '已通过 ref 修改高度'\n generalTarget.style.setProperty('height', '200px')\n }\n },\n}\n\n```\n:::"},"general-event":{"name":"组件公共事件","description":"","attribute":"| 名称 | 类型 | 描述 |\n| :- | :- | :- |\n| @click | (event: [UniPointerEvent](/component/common.md#unipointerevent)) => void | 手指触摸后马上离开。与tap相同,(推荐使用tap事件代替),冒泡事件 |\n| @mousedown | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标在元素上点击后触发 |\n| @mousemove | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标在元素上移动时触发 |\n| @mouseup | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标主按钮在元素上松开时触发 |\n| @touchstart | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作开始,冒泡事件,event.type 值为 touchstart |\n| @touchmove | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸后移动,冒泡事件,event.type 值为 touchmove |\n| @touchcancel | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作被打断,如来电提醒,弹窗,冒泡事件,event.type 值为 touchcancel |\n| @touchend | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作结束,冒泡事件,event.type 值为 touchend |\n| @tap | (event: [UniPointerEvent](/component/common.md#unipointerevent)) => void | 手指触摸后马上离开,冒泡事件 |\n| @longpress | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 如果一个组件被绑定了 longpress 事件,那么当用户手指触摸后,超过350ms再离开会触发,冒泡事件 |\n| @longtap | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸后,超过350ms再离开(推荐使用 longpress 事件代替) |\n| @transitionend | (event: [UniEvent](/component/common.md#unievent)) => void | transition 效果结束时触发 |","compatibility":"| | Web | Android | iOS |\n| :- | :- | :- | :- |\n| @click | 4.0 | 3.9 | 4.11 |\n| @mousedown | 4.0 | x | x |\n| @mousemove | 4.0 | x | x |\n| @mouseup | 4.0 | x | x |\n| @touchstart | 4.0 | 3.9 | 4.11 |\n| @touchmove | 4.0 | 3.9 | 4.11 |\n| @touchcancel | 4.0 | 3.9 | 4.11 |\n| @touchend | 4.0 | 3.9 | 4.11 |\n| @tap | 4.0 | 3.9 | 4.11 |\n| @longpress | 4.0 | 3.9 | 4.11 |\n| @longtap | 4.0 | 3.9 | 4.11 |\n| @transitionend | 4.0 | 3.93 | 4.11 |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/global-properties/global-properties.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/global-properties/global-properties\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\nexport default {\n data() {\n return {\n title: 'global-properties',\n generalId: 'general-id',\n generalClass: 'general-class',\n generalName: 'general-name',\n generalTitle: 'general-title',\n generalData: 'general-data',\n generalStyle: 'background-color: aqua',\n validateGeneralAttrText: '验证基础属性',\n hoverClass: 'hover-class',\n validateViewAttrText: '验证 view 属性',\n changeHeightByRefText: '通过 ref 修改高度',\n }\n },\n methods: {\n validateGeneralAttributes() {\n const generalTarget = this.$refs['general-target'] as UniElement\n const generalId = generalTarget.getAttribute('id')\n if (generalId != this.generalId) {\n this.validateGeneralAttrText = '基础属性 id 验证失败'\n return\n }\n // #ifdef APP\n if (!generalTarget.classList.includes('general-class')) {\n // #endif\n // #ifdef WEB\n if (!Array.from(generalTarget.classList).includes('general-class')) {\n // #endif\n this.validateGeneralAttrText = '基础属性 class 验证失败'\n return\n }\n const generalName = generalTarget.getAttribute('name')\n if (generalName != this.generalName) {\n this.validateGeneralAttrText = '基础属性 name 验证失败'\n return\n }\n const generalTitle = generalTarget.getAttribute('title')\n if (generalTitle != this.generalTitle) {\n this.validateGeneralAttrText = '基础属性 title 验证失败'\n return\n }\n const generalData = generalTarget.getAttribute('data-test')\n if (generalData != this.generalData) {\n this.validateGeneralAttrText = '基础属性 data-test 验证失败'\n return\n }\n this.validateGeneralAttrText = '基础属性验证成功'\n },\n changeHeight(){\n const generalTarget = this.$refs['general-target'] as UniElement\n this.changeHeightByRefText = '已通过 ref 修改高度'\n generalTarget.style.setProperty('height', '200px')\n }\n },\n}\n\n```\n:::"}} \ No newline at end of file +{"UniKeyEvent":{"name":"## UniKeyEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniKeyEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniKeyEvent 的属性值 @unikeyevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| keyCode | number | 是 | - | - | - |\n| keyType | string | 是 | - | - | - |\n","compatibility":"### UniKeyEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniEvent":{"name":"## UniEvent","description":"","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件的名称 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件的名称 |\n| eventInit | any | 是 | - | - | 事件初始参数。支持字段:`bubbles`表明该事件是否冒泡。可选,默认为false;`cancelable`表明该事件是否可以被取消。可选,默认为false。 |\n\n### UniEvent 的属性值 @unievent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| bubbles | boolean | 是 | - | - | 是否冒泡 |\n| cancelable | boolean | 是 | - | - | 是否可以取消 |\n| type | string | 是 | - | - | 事件类型 |\n| target | [UniElement](/dom/unielement.md) | 否 | - | - | 触发事件的组件 |\n| currentTarget | [UniElement](/dom/unielement.md) | 否 | - | - | 当前组件 |\n| timeStamp | number | 是 | - | - | 事件发生时的时间戳 |\n","methods":{"stopPropagation":{"name":"#### stopPropagation(): void @stoppropagation","description":"阻止当前事件的进一步传播","compatibility":"##### stopPropagation 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"preventDefault":{"name":"#### preventDefault(): void @preventdefault","description":"阻止当前事件的默认行为\n","compatibility":"##### preventDefault 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | x |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniElement":{"name":"## UniElement","description":"UVUE DOM 元素对象,描述了 UVUE DOM 元素所普通具有的属性和方法。","extends":"","param":"\n### UniElement 的属性值 @unielement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| classList | Array\\ | 是 | - | | 只读属性 获取当前元素的的 class 属性的动态集合。 |\n| firstChild | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的的第一个子元素,如果元素是无子元素,则返回 null。 |\n| lastChild | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的最后一个子元素,如果没有子元素,则返回 null。 |\n| parentElement | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素在 DOM 树中的父元素,如果没有父元素(如未添加到DOM树中),则返回null。 |\n| previousSibling | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取当前元素的前一个同级元素,没有则返回null。 |\n| nextElementSibling | [UniElement](/dom/unielement.md) | 否 | - | | 只读属性 获取在 DOM 树中紧跟在其后面的同级元素,如果指定的元素为最后一个元素,则返回 null。 |\n| children | Array\\<[UniElement](/dom/unielement.md)\\> | 是 | - | | 只读属性 获取当前元素包含的子元素的集合 |\n| tagName | string | 是 | - | | 只读属性 获取当前元素的标签名 |\n| nodeName | string | 是 | - | | 只读属性 获取当前元素的元素名称 |\n| dataset | Map\\ | 是 | - | | 只读属性 获取元素上自定义数据属性(data-*)的集合 |\n| attributes | Map\\ | 是 | - | | 只读属性 获取元素上所有属性元素的集合 |\n| style | [CSSStyleDeclaration](/dom/cssstyledeclaration.md) | 是 | - | | 只读属性 获取元素的CSS样式对象 |\n| scrollWidth | number | 是 | - | | 只读属性 获取可滚动元素内容的总宽度,仅scroll-view、list-view组件支持,其他组件返回视图宽度 |\n| scrollHeight | number | 是 | - | | 只读属性 获取可滚动元素内容的总高度,仅scroll-view、list-view组件支持,其他组件返回视图高度 |\n| scrollLeft | number | 是 | - | | 获取或修改元素滚动条到元素左边的距离像素数,仅scroll-view、list-view组件支持。其他组件返回0 |\n| scrollTop | number | 是 | - | | 获取或修改元素滚动条到元素顶部的距离像素数,仅scroll-view、list-view组件支持。其他组件返回0 |\n| offsetLeft | number | 是 | - | | 只读属性 元素的左边界偏移值 单位px |\n| offsetTop | number | 是 | - | | 只读属性 元素的顶部边界偏移值 单位px |\n| offsetWidth | number | 是 | - | | 只读属性 元素的布局宽度,宽度包含border、padding的数据值 单位px |\n| offsetHeight | number | 是 | - | | 只读属性 元素的布局高度,高度包含border、padding的数据值 单位px |\n| ext | Map\\ | 是 | - | | 只读属性 扩展属性 |\n","methods":{"takeSnapshot":{"name":"#### takeSnapshot(options: TakeSnapshotOptions): void @takesnapshot","description":"对当前组件进行截图,调用此方法会将当前组件(包含子节点)渲染结果导出成图片。\n成功会返回图片对应的临时文件路径,目前默认png格式\n","compatibility":"##### takeSnapshot 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| x | 3.93 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| options | **TakeSnapshotOptions** | 是 | - | - | 组件截图的参数对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| type | string | 否 | \"file\" | - | 截图导出类型,目前仅支持 'file' 保存到临时文件目录 |\n@| format | string | 否 | \"png\" | - | 截图文件格式,目前仅支持 'png' |\n@| success | (res: [TakeSnapshotSuccess](#takesnapshotsuccess-values)) => void | 否 | - | - | 接口调用成功的回调函数 |\n@| fail | (res: [TakeSnapshotFail](#takesnapshotfail-values)) => void | 否 | - | - | 接口调用失败的回调函数 |\n@| complete | (res: any) => void | 否 | - | - | 接口调用结束的回调函数(调用成功、失败都会执行) | \n\n###### TakeSnapshotSuccess 的属性值 @takesnapshotsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 |\n\n###### TakeSnapshotFail 的属性值 @takesnapshotfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errMsg | string | 是 | - | - | - |\n","returnValue":"","tutorial":""},"appendChild":{"name":"#### appendChild(aChild: UniElement): void @appendchild","description":"将一个元素添加到指定父元素的子元素列表的末尾处。如果将被插入的元素已经存在于当前文档的文档树中,那么将会它从原先的位置移动到新的位置。","compatibility":"##### appendChild 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| aChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 | \n","returnValue":"","tutorial":""},"insertBefore":{"name":"#### insertBefore(newChild: UniElement, refChild?: UniElement \\| null): UniElement \\| null @insertbefore","description":"在参考元素之前插入一个拥有指定父元素的子元素。如果给定的子元素是对文档中现有元素的引用,insertBefore() 会将其从当前位置移动到新位置。","compatibility":"##### insertBefore 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| newChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 |\n| refChild | [UniElement](/dom/unielement.md) | 否 | - | | 已存在父元素的子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"insertBefore_1":{"name":"#### insertBefore(newChild: UniElement): UniElement \\| null @insertbefore","description":"将一个元素添加到指定父元素的子元素列表的末尾处 功能等同于appendChild","compatibility":"##### insertBefore 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| newChild | [UniElement](/dom/unielement.md) | 是 | - | | 插入子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"setAttribute":{"name":"#### setAttribute(key: string, value: string): void @setattribute","description":"设置指定元素上的某个属性值。如果设置的属性已经存在,则更新该属性值;否则使用指定的名称和值添加一个新的属性。","compatibility":"##### setAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 |\n| value | string | 是 | - | - | 属性值域 | \n","returnValue":"","tutorial":""},"getAttribute":{"name":"#### getAttribute(key: string): string \\| null @getattribute","description":"获取元素指定的属性值,如果指定的属性不存在则返回null。","compatibility":"##### getAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| string | 否 |\n \n","tutorial":""},"hasAttribute":{"name":"#### hasAttribute(key: string): boolean @hasattribute","description":"返回改元素是否包含有指定的属性,属性存在则返回true,否则返回false。","compatibility":"##### hasAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"removeAttribute":{"name":"#### removeAttribute(key: string): void @removeattribute","description":"从元素中删除一个属性,如果指定的属性不存在,则不做任何操作,也不会产生错误。","compatibility":"##### removeAttribute 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| key | string | 是 | - | - | 属性名称 | \n","returnValue":"","tutorial":""},"getBoundingClientRect":{"name":"#### getBoundingClientRect(): DOMRect @getboundingclientrect","description":"获取元素的大小及其相对于窗口的位置信息。","compatibility":"##### getBoundingClientRect 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [DOMRect](/dom/domrect.md) | 一个 DOMRect 代表一个矩形。 |\n \n","tutorial":""},"getDrawableContext":{"name":"#### getDrawableContext(): DrawableContext \\| null @getdrawablecontext","description":"获取组件的绘制对象,仅uvue页面中的 view 组件支持,其它组件不支持则返回null。","compatibility":"##### getDrawableContext 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| x | 3.9 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [DrawableContext](/dom/drawablecontext.md) | 否 |\n \n","tutorial":""},"removeChild":{"name":"#### removeChild(aChild: UniElement): UniElement \\| null @removechild","description":"从元素中删除一个子元素,返回删除的元素。","compatibility":"##### removeChild 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| aChild | [UniElement](/dom/unielement.md) | 是 | - | | 被删除子元素对象 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"remove":{"name":"#### remove(): void @remove","description":"把元素对象从它所属的 DOM 树中删除。","compatibility":"##### remove 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"scrollTo":{"name":"#### scrollTo(x: number, y: number): void @scrollto","description":"使界面滚动到给定元素的指定坐标位置 仅scroll-view、list-view组件支持","compatibility":"##### scrollTo 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | x轴要滚动到坐标位置(单位px) |\n| y | number | 是 | - | - | y轴要滚动到坐标位置(单位px) | \n","returnValue":"","tutorial":""},"scrollBy":{"name":"#### scrollBy(x: number, y: number): void @scrollby","description":"使得元素滚动一段特定距离 仅scroll-view、list-view组件支持","compatibility":"##### scrollBy 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | x轴要滚动的距离(单位px) |\n| y | number | 是 | - | - | y轴要滚动的距离(单位px) | \n","returnValue":"","tutorial":""},"querySelector":{"name":"#### querySelector(selector: string.cssSelectorString): UniElement \\| null @queryselector","description":"返回文档中与指定选择器或选择器组匹配的第一个 Element对象。如果找不到匹配项,则返回null","compatibility":"##### querySelector 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| selector | [string.cssSelectorString](/uts/data-type.md#ide-string) | 是 | - | - | CSS 选择器字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UniElement](/dom/unielement.md) | 否 |\n \n","tutorial":""},"querySelectorAll":{"name":"#### querySelectorAll(selector: string.cssSelectorString): UniElement[] \\| null @queryselectorall","description":"返回与指定的选择器组匹配的文档中的元素列表","compatibility":"##### querySelectorAll 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| selector | [string.cssSelectorString](/uts/data-type.md#ide-string) | 是 | - | - | CSS 选择器字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| Array\\<[UniElement](/dom/unielement.md)\\> | 否 |\n \n","tutorial":""},"focus":{"name":"#### focus(): void @focus","description":"使元素获取焦点 仅input、Textarea组件支持","compatibility":"##### focus 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"blur":{"name":"#### blur(): void @blur","description":"使元素丢失焦点 仅input、Textarea组件支持","compatibility":"##### blur 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"getIOSView":{"name":"#### getIOSView(): UIView \\| null @getiosview","description":"获取元素ios原生view","compatibility":"##### getIOSView 兼容性 \n| Web | Android | Android uni-app x UTS 插件 | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- | :- |\n| - | x | x | x | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| UIView | 否 |\n \n","tutorial":""},"getAndroidView":{"name":"#### getAndroidView(): View \\| null @getandroidview","description":"获取元素android原生view 可能返回null","compatibility":"##### getAndroidView 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| View | 否 |\n \n","tutorial":""},"getAndroidView_1":{"name":"#### getAndroidView\\(): T \\| null @getandroidview","description":"获取元素android原生view 通过泛型定义view类型 可能返回null","compatibility":"##### getAndroidView 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| T | 否 |\n \n","tutorial":""},"getAndroidActivity":{"name":"#### getAndroidActivity(): Activity \\| null @getandroidactivity","description":"获取元素android原生activity 可能返回null","compatibility":"##### getAndroidActivity 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.25 | x |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| Activity | 否 |\n \n","tutorial":""}},"compatibility":"### UniElement 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.0 | 4.11 |"},"CSSStyleDeclaration":{"name":"## CSSStyleDeclaration","description":"CSSStyleDeclaration表示一个CSS 声明块对象,它是一个 CSS 属性键值对的集合,暴露样式信息和各种与样式相关的方法和属性。","extends":"","param":"","methods":{"setProperty":{"name":"#### setProperty(name: string \\| string.cssPropertyString, value: any \\| null): void @setproperty","description":"对CSS指定样式设置一个新值,如有此样式已存在则更新。","compatibility":"##### setProperty 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | CSS样式名称 |\n| value | any | 否 | - | - | 要设置的新CSS样式值 | \n","returnValue":"","tutorial":""},"getPropertyValue":{"name":"#### getPropertyValue(property: string \\| string.cssPropertyString): any \\| null @getpropertyvalue","description":"获取CSS指定的样式值,如果指定的样式不存在则返回null。","compatibility":"##### getPropertyValue 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| property | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | 要获取的CSS样式名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""},"removeProperty":{"name":"#### removeProperty(property: string \\| string.cssPropertyString): any \\| null @removeproperty","description":"删除CSS指定的样式值","compatibility":"##### removeProperty 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| property | string ([string.cssPropertyString](/uts/data-type.md#ide-string)) | 是 | - | - | 要删除的CSS样式名称 | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""}},"compatibility":"### CSSStyleDeclaration 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |"},"TakeSnapshotOptions":{"name":"## TakeSnapshotOptions","description":"组件截图的参数配置选项","extends":"","param":"\n### TakeSnapshotOptions 的属性值 @takesnapshotoptions-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 否 | \"file\" | - | 截图导出类型,目前仅支持 'file' 保存到临时文件目录 |\n| format | string | 否 | \"png\" | - | 截图文件格式,目前仅支持 'png' |\n","methods":{"success":{"name":"#### (res: TakeSnapshotSuccess) => void @success","description":"接口调用成功的回调函数","compatibility":"##### success 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | **TakeSnapshotSuccess** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 | \n","returnValue":"","tutorial":""},"fail":{"name":"#### (res: TakeSnapshotFail) => void @fail","description":"接口调用失败的回调函数","compatibility":"##### fail 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | **TakeSnapshotFail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| errMsg | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"complete":{"name":"#### (res: any) => void @complete","description":"接口调用结束的回调函数(调用成功、失败都会执行)","compatibility":"##### complete 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| res | any | 是 | - | - | - | \n","returnValue":"","tutorial":""}},"compatibility":"### TakeSnapshotOptions 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotSuccessCallback":{"name":"## TakeSnapshotSuccessCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotSuccessCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotSuccess":{"name":"## TakeSnapshotSuccess","description":"","extends":"","param":"\n### TakeSnapshotSuccess 的属性值 @takesnapshotsuccess-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| tempFilePath | string | 是 | - | - | 截图保存的临时文件路径 |\n","compatibility":"### TakeSnapshotSuccess 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotFailCallback":{"name":"## TakeSnapshotFailCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotFailCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotFail":{"name":"## TakeSnapshotFail","description":"","extends":"","param":"\n### TakeSnapshotFail 的属性值 @takesnapshotfail-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errMsg | string | 是 | - | - | - |\n","compatibility":"### TakeSnapshotFail 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"TakeSnapshotCompleteCallback":{"name":"## TakeSnapshotCompleteCallback","description":"","extends":"","param":"","compatibility":"### TakeSnapshotCompleteCallback 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"DOMRect":{"name":"## DOMRect","description":"一个 DOMRect 代表一个矩形。","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 否 | 0 | - | 矩形原点的x坐标 |\n| y | number | 否 | 0 | - | 矩形原点的y坐标 |\n| width | number | 否 | 0 | - | 矩形的宽 |\n| height | number | 否 | 0 | - | 矩形的高 |\n\n### DOMRect 的属性值 @domrect-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | | 矩形的宽 |\n| height | number | 是 | - | | 矩形的高 |\n| x | number | 是 | - | | 矩形原点的x坐标 |\n| y | number | 是 | - | | 矩形原点的y坐标 |\n| left | number | 是 | - | | 矩形的左坐标值 |\n| right | number | 是 | - | | 矩形的右坐标值 |\n| top | number | 是 | - | | 矩形的顶坐标值 |\n| bottom | number | 是 | - | | 矩形的底坐标值 |\n","compatibility":"### DOMRect 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |"},"DrawableContext":{"name":"## DrawableContext","description":"","extends":"","param":"\n### DrawableContext 的属性值 @drawablecontext-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| font | string | 是 | 10px | | 设置字体大小 |\n| fillStyle | [string.ColorString](/uts/data-type.md#ide-string) | 是 | #000 (黑色) | | 设置填充颜色 |\n| lineCap | string | 是 | butt | | 指定如何绘制每一条线条末端的属性,可选值:`butt`线段末端以方形结束;`round`线段末端以圆形结束;`square`线段末端以方形结束,但是会增加一个一半宽度的矩形区域。 |\n| lineDashOffset | number | 是 | - | | 设置虚线偏移量 |\n| lineJoin | string | 是 | miter | | 设置 2 个长度不为 0 的线条相连部分如何连接在一起的属性,可选值:`bevel`斜角;`round`圆角;`miter`尖角。 |\n| lineWidth | number | 是 | 1px | | 设置线条的宽度 |\n| strokeStyle | [string.ColorString](/uts/data-type.md#ide-string) | 是 | #000 (黑色) | | 设置边框的颜色 |\n| textAlign | string | 是 | left | | 设置文本的对齐方式,可取值:`left`左对齐;`center`居中对齐;`right`右对齐。 |\n","methods":{"beginPath":{"name":"#### beginPath(): void @beginpath","description":"创建一个新的空路径","compatibility":"##### beginPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean \\| null): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆心的X轴坐标 |\n| y | number | 是 | - | - | 圆心的Y轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 否 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"将一个新的路径的起始点移动到 (x,y) 坐标","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 点的X轴坐标 |\n| y | number | 是 | - | - | 点的Y轴坐标 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"将路径的最后一个点连接到 (x,y) 坐标","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 线终点的X轴坐标 |\n| y | number | 是 | - | - | 线终点的Y轴坐标 | \n","returnValue":"","tutorial":""},"closePath":{"name":"#### closePath(): void @closepath","description":"闭合路径,将最后一个点与起点连接起来。如果图形已经封闭,或者只有一个点,那么此方法不会产生任何效果。","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"stroke":{"name":"#### stroke(): void @stroke","description":"绘制当前或已经存在的路径的边框。","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"strokeRect":{"name":"#### strokeRect(x: number, y: number, width: number, height: number): void @strokerect","description":"绘制一个矩形框","compatibility":"##### strokeRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"strokeText":{"name":"#### strokeText(text: string, x: number, y: number): void @stroketext","description":"绘制空心字符","compatibility":"##### strokeText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要绘制的字符 |\n| x | number | 是 | - | - | 字符开始绘制的X轴坐标 |\n| y | number | 是 | - | - | 字符开始绘制的Y轴坐标 | \n","returnValue":"","tutorial":""},"fill":{"name":"#### fill(fillRule?: string \\| null): void @fill","description":"填充当前或已存在的路径","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 否 | nonzero | - | 填充规则。可取值:`nonzero`非零环绕规则;`evenodd`奇偶环绕规则。 | \n","returnValue":"","tutorial":""},"fillRect":{"name":"#### fillRect(x: number, y: number, width: number, height: number): void @fillrect","description":"绘制一个实心矩形","compatibility":"##### fillRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的X轴坐标 |\n| y | number | 是 | - | - | 矩形起点的Y轴坐标 |\n| width | number | 是 | - | - | 矩形宽度 |\n| height | number | 是 | - | - | 矩形高度 | \n","returnValue":"","tutorial":""},"fillText":{"name":"#### fillText(text: string, x: number, y: number): void @filltext","description":"绘制实心字符","compatibility":"##### fillText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要绘制的字符 |\n| x | number | 是 | - | - | 字符开始绘制的X轴坐标 |\n| y | number | 是 | - | - | 字符开始绘制的Y轴坐标 | \n","returnValue":"","tutorial":""},"reset":{"name":"#### reset(): void @reset","description":"清空绘制数据","compatibility":"##### reset 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"update":{"name":"#### update(): void @update","description":"将所有绘制内容更新到画布上","compatibility":"##### update 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"","returnValue":"","tutorial":""},"setLineDash":{"name":"#### setLineDash(segments: Array\\): void @setlinedash","description":"设置虚线样式","compatibility":"##### setLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| segments | number[\\] | 是 | - | - | 一组描述交替绘制线段和间距长度的数字。 | \n","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"创建三次方贝塞尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个贝塞尔控制点的 x 坐标 |\n| cp1y | number | 是 | - | - | 第一个贝塞尔控制点的 y 坐标 |\n| cp2x | number | 是 | - | - | 第二个贝塞尔控制点的 x 坐标 |\n| cp2y | number | 是 | - | - | 第二个贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""}},"compatibility":"### DrawableContext 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| x | 3.9 | 4.11 |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/API/element-draw/element-draw.uvue) \n >\n> 该 API 不支持 Web,请运行 hello uni-app x 到 App 平台体验 \n```uvue\n\n\n\n\n\n\n```"},"UniCallbackWrapper":{"name":"## UniCallbackWrapper","description":"事件回调封装类,用于注销监听函数的形参","extends":"","param":"","compatibility":"### UniCallbackWrapper 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniMouseEvent":{"name":"## UniMouseEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniPointerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniMouseEvent 的属性值 @unimouseevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| x | number | 是 | - | - | 相对于页面可显示区域左边的距离,同`clientX` |\n| y | number | 是 | - | - | 相对于页面可显示区域顶部的距离,同`clientY` |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n","compatibility":"### UniMouseEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniCustomEvent":{"name":"## UniCustomEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniCustomEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| detail | T | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| options | any | 是 | - | - | - |\n\n### UniCustomEvent 的属性值 @unicustomevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | T | 是 | - | - | - |\n","compatibility":"### UniCustomEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniTouchEvent":{"name":"## UniTouchEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniTouchEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniTouchEvent 的属性值 @unitouchevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| touches | Array\\<**UniTouch**\\> | 是 | - | - | 当前停留在屏幕中的触摸点信息的数组 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n@| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n@| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n@| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n@| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n@| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n@| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n@| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n| changedTouches | Array\\<**UniTouch**\\> | 是 | - | - | 当前变化的触摸点信息的数组 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n@| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n@| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n@| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n@| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n@| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n@| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n@| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n","compatibility":"### UniTouchEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniTouch":{"name":"## UniTouch","description":"","extends":"","param":"\n### UniTouch 的属性值 @unitouch-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| identifier | number | 是 | - | - | 触摸点的标识符。这个值在这根手指所引发的所有事件中保持一致,直到手指抬起。 |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n| force | number | 否 | - | - | 返回当前触摸点按下的压力大小 |\n","compatibility":"### UniTouch 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniPointerEvent":{"name":"## UniPointerEvent","description":"","extends":"```mermaid\ngraph LR\n \nUniPointerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```","param":"\n### UniPointerEvent 的属性值 @unipointerevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| clientX | number | 是 | - | - | 相对于页面可显示区域左边的距离 |\n| clientY | number | 是 | - | - | 相对于页面可显示区域顶部的距离 |\n| x | number | 是 | - | - | 相对于页面可显示区域左边的距离,同`clientX` |\n| y | number | 是 | - | - | 相对于页面可显示区域顶部的距离,同`clientY` |\n| pageX | number | 是 | - | - | 相对于文档左边的距离 |\n| pageY | number | 是 | - | - | 相对于文档顶部的距离 |\n| screenX | number | 是 | - | - | 相对于屏幕左边距离 |\n| screenY | number | 是 | - | - | 相对于屏幕顶部的距离 |\n","compatibility":"### UniPointerEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniObjectCustomEvent":{"name":"## UniObjectCustomEvent","description":"UniObject自定义事件","extends":"```mermaid\ngraph LR\n \nUniObjectCustomEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n| detail | any | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | - |\n\n### UniObjectCustomEvent 的属性值 @uniobjectcustomevent-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 是 | - | - | 事件类型 |\n| detail | UTSJSONObject | 是 | - | - | - |\n","compatibility":"### UniObjectCustomEvent 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | 4.25 | 4.25 |"},"UniImageElement":{"name":"## UniImageElement","description":"image元素对象","extends":"```mermaid\ngraph LR\n \nUniImageElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniImageElement 的属性值 @uniimageelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| src | string | 是 | - | | 图片url |\n","methods":{"onload":{"name":"#### onload(): void \\| null @onload","description":"图片加载完成事件","compatibility":"##### onload 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| - | 4.25 | 4.25 | x |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniImageElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniInputElement":{"name":"## UniInputElement","description":"input元素对象","extends":"```mermaid\ngraph LR\n \nUniInputElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniInputElement 的属性值 @uniinputelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| type | string | 是 | - | | input的类型 |\n| disabled | boolean | 是 | - | | 是否禁用 |\n| autofocus | boolean | 是 | - | | 自动获取焦点 |\n| value | string | 是 | - | | 输入框的初始内容 |\n","compatibility":"### UniInputElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | x |"},"UniTextareaElement":{"name":"## UniTextareaElement","description":"textarea元素对象","extends":"```mermaid\ngraph LR\n \nUniTextareaElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniTextareaElement 的属性值 @unitextareaelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| type | string | 是 | - | | input的类型 |\n| disabled | boolean | 是 | - | | 是否禁用 |\n| autofocus | boolean | 是 | - | | 自动获取焦点 |\n| value | string | 是 | - | | 输入框的初始内容 |\n","compatibility":"### UniTextareaElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniTextElement":{"name":"## UniTextElement","description":"text元素对象","extends":"```mermaid\ngraph LR\n \nUniTextElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniTextElement 的属性值 @unitextelement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| value | string | 是 | - | | 只读属性 text元素的文案内容 |\n","methods":{"getTextExtra":{"name":"#### getTextExtra(): any \\| null @gettextextra","description":"","compatibility":"##### getTextExtra 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 |\n \n","tutorial":""}},"compatibility":"### UniTextElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniWebViewElement":{"name":"## UniWebViewElement","description":"web-view元素对象","extends":"```mermaid\ngraph LR\n \nUniWebViewElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"","methods":{"back":{"name":"#### back(): void @back","description":"后退","compatibility":"##### back 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"forward":{"name":"#### forward(): void @forward","description":"前进","compatibility":"##### forward 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"reload":{"name":"#### reload(): void @reload","description":"重新加载","compatibility":"##### reload 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"stop":{"name":"#### stop(): void @stop","description":"停止加载","compatibility":"##### stop 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"evalJS":{"name":"#### evalJS(js: string): void @evaljs","description":"原生和WebView通信(执行JS脚本)","compatibility":"##### evalJS 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| js | string | 是 | - | - | - | \n","returnValue":"","tutorial":""}},"compatibility":"### UniWebViewElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.0 | 4.0 | 4.11 | 4.25 |"},"UniVideoElement":{"name":"## UniVideoElement","description":"video元素对象","extends":"```mermaid\ngraph LR\n \nUniVideoElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"","methods":{"play":{"name":"#### play(): void @play","description":"播放","compatibility":"##### play 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"pause":{"name":"#### pause(): void @pause","description":"暂停","compatibility":"##### pause 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"seek":{"name":"#### seek(position: number): void @seek","description":"跳转到指定位置","compatibility":"##### seek 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| position | number | 是 | - | - | 跳转到指定位置(秒) | \n","returnValue":"","tutorial":""},"stop":{"name":"#### stop(): void @stop","description":"停止视频","compatibility":"##### stop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"sendDanmu":{"name":"#### sendDanmu(danmu: Danmu): void @senddanmu","description":"发送弹幕","compatibility":"##### sendDanmu 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| danmu | **Danmu** | 是 | - | - | 弹幕数据 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| text | string | 否 | - | - | 弹幕文字 |\n@| color | string | 否 | - | - | 弹幕颜色 |\n@| time | number | 否 | - | - | 显示时刻 | \n","returnValue":"","tutorial":""},"playbackRate":{"name":"#### playbackRate(rate: number): void @playbackrate","description":"设置倍速播放","compatibility":"##### playbackRate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| rate | number | 是 | - | - | 支持倍率 0.5/0.8/1.0/1.25/1.5 | \n","returnValue":"","tutorial":""},"requestFullScreen":{"name":"#### requestFullScreen(direction?: RequestFullScreenOptions \\| null): void @requestfullscreen","description":"进入全屏","compatibility":"##### requestFullScreen 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| direction | **RequestFullScreenOptions** | 否 | - | - | 0\\|正常竖向, 90\\|屏幕逆时针90度, -90\\|屏幕顺时针90度 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | number | 否 | - | - | direction |\n@@| 合法值 | 兼容性 | 描述 |\n@@| :- | :-: | :- |\n@@| 0 | - | 正常竖向 |\n@@| 90 | - | 屏幕逆时针90度 |\n@@| -90 | - | 屏幕顺时针90度 | \n","returnValue":"","tutorial":""},"exitFullScreen":{"name":"#### exitFullScreen(): void @exitfullscreen","description":"退出全屏","compatibility":"##### exitFullScreen 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""}},"compatibility":"### UniVideoElement 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"Danmu":{"name":"## Danmu","description":"","extends":"","param":"\n### Danmu 的属性值 @danmu-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 否 | - | - | 弹幕文字 |\n| color | string | 否 | - | - | 弹幕颜色 |\n| time | number | 否 | - | - | 显示时刻 |\n","compatibility":"### Danmu 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"RequestFullScreenOptions":{"name":"## RequestFullScreenOptions","description":"","extends":"","param":"\n### RequestFullScreenOptions 的属性值 @requestfullscreenoptions-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| direction | number | 否 | - | - | direction |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| 0 | - | 正常竖向 |\n@| 90 | - | 屏幕逆时针90度 |\n@| -90 | - | 屏幕顺时针90度 |\n","compatibility":"### RequestFullScreenOptions 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniCanvasElement":{"name":"## UniCanvasElement","description":"canvas元素对象","extends":"```mermaid\ngraph LR\n \nUniCanvasElement -- Extends --> UniElement\n style UniElement color:#42b983\n click UniElement \"https://doc.dcloud.net.cn/uni-app-x/dom/unielement.html\"\n```","param":"\n### UniCanvasElement 的属性值 @unicanvaselement-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | | Canvas宽度 |\n| height | number | 是 | - | | Canvas高度 |\n","methods":{"getContext":{"name":"#### getContext(contentType: string): CanvasRenderingContext2D \\| null @getcontext","description":"返回 Canvas 的绘图上下文","compatibility":"##### getContext 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| contentType | string | 是 | - | - | - | \n","returnValue":"##### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [CanvasRenderingContext2D](/api/canvasrenderingcontext2d.md) | 否 |\n \n","tutorial":""},"toBlob":{"name":"#### toBlob(callback: BlobCallback): void @toblob","description":"创造 Blob 对象","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | x | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toBlob_1":{"name":"#### toBlob(callback: BlobCallback, type: string): void @toblob","description":"","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - |\n| type | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toBlob_2":{"name":"#### toBlob(callback: BlobCallback, type: string, quality: number): void @toblob","description":"","compatibility":"##### toBlob 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | BlobCallback | 是 | - | - | - |\n| type | string | 是 | - | - | - |\n| quality | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"toDataURL":{"name":"#### toDataURL(type?: string \\| null, encoderOptions?: any \\| null): string @todataurl","description":"返回一个包含图片展示的 data URI (app平台不支持webp格式)","compatibility":"##### toDataURL 兼容性 \n| Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| type | string | 否 | - | - | |\n| encoderOptions | any | 否 | - | - | | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| string |\n \n","tutorial":""}},"compatibility":"### UniCanvasElement 兼容性 \n | Web | Android | iOS | iOS uni-app x UTS 插件 |\n| :- | :- | :- | :- |\n| 4.21 | 4.25 | 4.25 | 4.25 |"},"CanvasRenderingContext2D":{"name":"## CanvasRenderingContext2D","description":"canvas元素的绘图2D渲染上下文, 它用于绘制形状、文本、图像和其他对象","extends":"","param":"\n### CanvasRenderingContext2D 的属性值 @canvasrenderingcontext2d-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| canvas | [UniCanvasElement](/dom/unicanvaselement.md) | 是 | - | | 是对与给定上下文关联的HTMLCanvasElement对象的只读引用 |\n| direction | string | 是 | inherit | | 描述当前文本方向 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| ltr | - | - |\n@| rtl | - | - |\n@| inherit | - | - |\n| fillStyle | string | 是 | #000 (黑色) | | 设置填充颜色 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| interface | | - |\n@| string.ColorString | - | - |\n| filter | string | 是 | none | | 提供模糊、灰度等过滤效果的属性。它类似于 CSS filter 属性,并且接受相同的函数 |\n| font | string | 是 | 10px | | 设置字体大小 |\n| fontStretch | string | 是 | normal | | 指定绘制文本时字体如何被扩展或压缩。该属性对应于 CSS 中的 font-stretch 属性 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| ultra-condensed | - | - |\n@| extra-condensed | - | - |\n@| condensed | - | - |\n@| semi-condensed | - | - |\n@| normal | - | - |\n@| semi-expanded | - | - |\n@| expanded | - | - |\n@| extra-expanded | - | - |\n@| ultra-expanded | - | - |\n| globalAlpha | number | 是 | 1.0 | | 用来描述在 canvas 上绘图之前,设置图形和图片透明度的属性。数值的范围从 0.0(完全透明)到 1.0(完全不透明) |\n| globalCompositeOperation | string | 是 | source-over | | 在绘制新形状时应用的合成操作的类型,其中 type 是用于标识要使用的合成或混合模式操作的字符串 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| source-over | - | - |\n@| source-atop | - | - |\n@| source-in | - | - |\n@| source-out | - | - |\n@| destination-over | - | - |\n@| destination-atop | - | - |\n@| destination-in | - | - |\n@| destination-out | - | - |\n@| lighter | - | - |\n@| copy | - | - |\n@| xor | - | - |\n| imageSmoothingEnabled | boolean | 是 | true | | 用于设置是否对缩放后的图片进行平滑处理,true 表示进行平滑处理,false 表示不进行 |\n| imageSmoothingQuality | string | 是 | low | | 用于设置图像平滑度,要使此属性生效,imageSmoothingEnabled 属性必须为 true,可选值:`low`低质量; `medium`中等质量;`high`高质量。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| low | - | - |\n@| medium | - | - |\n@| high | - | - |\n| letterSpacing | string | 是 | 0px | | 用于指定绘制文本时字母之间的间距。这对应于 CSS 中的 letter-spacing 属性 |\n| lineCap | string | 是 | butt | | 指定如何绘制每一条线条末端的属性,可选值:`butt`线段末端以方形结束;`round`线段末端以圆形结束;`square`线段末端以方形结束,但是会增加一个一半宽度的矩形区域。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| butt | - | - |\n@| round | - | - |\n@| square | - | - |\n| lineDashOffset | number | 是 | 0.0 | | 设置虚线偏移量 |\n| lineJoin | string | 是 | miter | | 设置 2 个长度不为 0 的线条相连部分如何连接在一起的属性,可选值:`bevel`斜角;`round`圆角;`miter`尖角。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| round | - | - |\n@| bevel | - | - |\n@| miter | - | - |\n| lineWidth | number | 是 | 1.0 | | 设置线条的宽度, 零、负数、Infinity 和 NaN 值将被忽略 |\n| miterLimit | number | 是 | 10.0 | | 设置斜接面限制比例的属性。当获取属性值时,会返回当前的值。当给属性赋值时,0、负数、 Infinity 和 NaN 都会被忽略;除此之外都会被赋予一个新值。 |\n| shadowBlur | number | 是 | 0 | | 用于描述模糊效果程度,其中 0 表示没有模糊,数字越大表示模糊程度越高。这个值不对应于像素数量,并且不受当前变换矩阵的影响。负数、Infinity 和 NaN 将被忽略 |\n| shadowColor | string | 是 | fully-transparent black | | 描述阴影颜色,只有当 shadowColor 属性设置为非透明值时,阴影才会被绘制。其中的 shadowBlur、shadowOffsetX 或 shadowOffsetY 属性中至少有一个必须是非零的。 |\n| shadowOffsetX | number | 是 | 0 | | 指定阴影在水平方向上的偏移距离。正值向右偏移,负值向左偏移。默认值为 0(无水平偏移)。Infinity 和 NaN 值将被忽略 |\n| shadowOffsetY | number | 是 | 0 | | 指定阴影在垂直方向上的偏移距离。正值向右偏移,负值向左偏移。默认值为 0(无水平偏移)。Infinity 和 NaN 值将被忽略 |\n| strokeStyle | string | 是 | #000 (黑色) | | 设置边框的颜色 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| interface | | - |\n@| string.ColorString | - | - |\n| textAlign | string | 是 | left | | 设置文本的对齐方式,可取值:`left`左对齐;`center`居中对齐;`right`右对齐。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| left | - | - |\n@| right | - | - |\n@| center | - | - |\n@| start | - | - |\n@| end | - | - |\n| textBaseline | string | 是 | alphabetic | | 描述绘制文本时,当前文本基线的属性 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| top | - | - |\n@| hanging | - | - |\n@| middle | - | - |\n@| alphabetic | - | - |\n@| ideographic | - | - |\n@| bottom | - | - |\n| textRendering | string | 是 | auto | | 用于在渲染文本时向渲染引擎提供应该如何优化的相关信息 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| | - | - |\n@| auto | - | - |\n@| optimizeSpeed | - | - |\n@| optimizeLegibility | - | - |\n@| geometricPrecision | - | - |\n| wordSpacing | string | 是 | 0px | | 用于指定绘制文本时单词之间的间距, 如果设置为无效或无法解析的值,则属性值将保持不变 |\n","methods":{"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆弧中心(圆心)的 x 轴坐标 |\n| y | number | 是 | - | - | 圆弧中心(圆心)的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 否 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"arcTo":{"name":"#### arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void @arcto","description":"根据控制点和半径绘制圆弧路径,使用当前的描点 (前一个 moveTo 或 lineTo 等函数的止点)。根据当前描点与给定的控制点 1 连接的直线,和控制点 1 与控制点 2 连接的直线,作为使用指定半径的圆的切线,画出两条切线之间的弧线路径","compatibility":"##### arcTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x1 | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| y1 | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| x2 | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| y2 | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 | \n","returnValue":"","tutorial":""},"beginPath":{"name":"#### beginPath(): void @beginpath","description":"开始创建一个路径。需要调用 fill 或者 stroke 才会使用路径进行填充或描边","compatibility":"##### beginPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"绘制三次贝赛尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| cp1y | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| cp2x | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| cp2y | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| x | number | 是 | - | - | 结束点的 x 轴坐标 |\n| y | number | 是 | - | - | 结束点的 y 轴坐标 | \n","returnValue":"","tutorial":""},"clearRect":{"name":"#### clearRect(x: number, y: number, width: number, height: number): void @clearrect","description":"清除画布上在该矩形区域内的内容","compatibility":"##### clearRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"clip":{"name":"#### clip(): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"clip_1":{"name":"#### clip(path: Path2D): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用 | \n","returnValue":"","tutorial":""},"clip_2":{"name":"#### clip(fillRule: string): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"clip_3":{"name":"#### clip(path: Path2D, fillRule: string): void @clip","description":"将当前创建的路径设置为当前剪切路径","compatibility":"##### clip 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用 |\n| fillRule | string | 是 | - | - | - | \n","returnValue":"","tutorial":""},"closePath":{"name":"#### closePath(): void @closepath","description":"关闭一个路径","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"createImageData":{"name":"#### createImageData(width: number, height: number): void @createimagedata","description":"创建一个新的、空白的、指定大小的 ImageData 对象。所有的像素在新对象中都是透明的黑色","compatibility":"##### createImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | - | - |\n| height | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"createPattern":{"name":"#### createPattern(image: Image, repetition: string): CanvasPattern @createpattern","description":"对指定的图像创建模式的方法,可在指定的方向上重复元图像","compatibility":"##### createPattern 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| image | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | 重复的图像源,支持代码包路径和本地临时路径 (本地路径) |\n| repetition | string | 是 | - | - | 如何重复图像 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| CanvasPattern | 接口表示一个不透明对象,描述了一个基于图像、画布或视频的模板,该模板通过 CanvasRenderingContext2D.createPattern() 方法创建 |\n \n","tutorial":""},"createLinearGradient":{"name":"#### createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient @createlineargradient","description":"创建一个线性的渐变颜色。返回的CanvasGradient对象需要使用 CanvasGradient.addColorStop() 来指定渐变点,至少要两个","compatibility":"##### createLinearGradient 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x0 | number | 是 | - | - | 起点的 x 坐标 |\n| y0 | number | 是 | - | - | 起点的 y 坐标 |\n| x1 | number | 是 | - | - | 终点的 x 坐标 |\n| y1 | number | 是 | - | - | 终点的 y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [CanvasGradient](#canvasgradient-values) | 表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回 |\n\n###### CanvasGradient 的方法 @canvasgradient-values \n\n###### addColorStop(stop: number, color: string): void @addcolorstop\n添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染\n###### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n\n##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n\n \n","tutorial":""},"createRadialGradient":{"name":"#### createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r01: number): CanvasGradient @createradialgradient","description":"根据参数确定两个圆的坐标,绘制放射性渐变。注意App平台和Web平台绘制效果有差异","compatibility":"##### createRadialGradient 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x0 | number | 是 | - | - | 开始圆形的 x 轴坐标 |\n| y0 | number | 是 | - | - | 开始圆形的 y 轴坐标 |\n| r0 | number | 是 | - | - | 开始圆形的半径 |\n| x1 | number | 是 | - | - | 结束圆形的 x 轴坐标 |\n| y1 | number | 是 | - | - | 结束圆形的 y 轴坐标 |\n| r01 | number | 是 | - | - | 结束圆形的半径 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| [CanvasGradient](#canvasgradient-values) | 表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回 |\n\n###### CanvasGradient 的方法 @canvasgradient-values \n\n###### addColorStop(stop: number, color: string): void @addcolorstop\n添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染\n###### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n\n##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n\n \n","tutorial":""},"draw":{"name":"#### draw(): void @draw","description":"将之前在绘图上下文中的描述(路径、变形、样式)画到 canvas 中, 该操作为可选非web标准,canvas组件会自动选择合适时机进行绘制","compatibility":"##### draw 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"drawImage":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number): void @drawimage","description":"绘制图像到画布","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | 所要绘制的图片资源 |\n| sx | number | 是 | - | - | 需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 x 坐标 |\n| sy | number | 是 | - | - | 需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 y 坐标 | \n","returnValue":"","tutorial":""},"drawImage_1":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number, sWidth: number, sHeight: number): void @drawimage","description":"","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | image元素对象 |\n| sx | number | 是 | - | - | - |\n| sy | number | 是 | - | - | - |\n| sWidth | number | 是 | - | - | - |\n| sHeight | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"drawImage_2":{"name":"#### drawImage(imageResource: Image, sx: number, sy: number, sWidth: number, sHeight: number, dx: number, dy: number, dWidth: number, dHeight: number): void @drawimage","description":"","compatibility":"##### drawImage 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageResource | [UniImageElement](/dom/uniimageelement.md) | 是 | - | | image元素对象 |\n| sx | number | 是 | - | - | - |\n| sy | number | 是 | - | - | - |\n| sWidth | number | 是 | - | - | - |\n| sHeight | number | 是 | - | - | - |\n| dx | number | 是 | - | - | - |\n| dy | number | 是 | - | - | - |\n| dWidth | number | 是 | - | - | - |\n| dHeight | number | 是 | - | - | - | \n","returnValue":"","tutorial":""},"ellipse":{"name":"#### ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @ellipse","description":"添加椭圆路径。椭圆的圆心在(x,y)位置,半径分别是radiusX 和 radiusY,按照anticlockwise(默认顺时针)指定的方向,从 startAngle 开始绘制,到 endAngle 结束","compatibility":"##### ellipse 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 椭圆圆心的 x 轴(水平)坐标 |\n| y | number | 是 | - | - | 椭圆圆心的 y 轴(垂直)坐标 |\n| radiusX | number | 是 | - | - | 椭圆长轴的半径。必须为非负数 |\n| radiusY | number | 是 | - | - | 椭圆短轴的半径。必须为非负数。 |\n| rotation | number | 是 | - | - | 椭圆的旋转角度,以弧度表示。 |\n| startAngle | number | 是 | - | - | 椭圆弧的起始偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| endAngle | number | 是 | - | - | 椭圆弧的结束偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| anticlockwise | boolean | 是 | - | - | 一个可选的布尔值,如果为 true,则逆时针绘制椭圆弧。默认值为 false(顺时针)。 | \n","returnValue":"","tutorial":""},"fill":{"name":"#### fill(): void @fill","description":"对当前路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"fill_1":{"name":"#### fill(fillRule: \"nonzero\" \\| \"evenodd\"): void @fill","description":"对当前路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| fillRule | string | 是 | - | - | 填充当前或已存在的路径的方法。采取非零环绕(nonzero)或者奇偶环绕(evenodd)规则 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nonzero | - | - |\n@| evenodd | - | - | \n","returnValue":"","tutorial":""},"fill_2":{"name":"#### fill(path: Path2D): void @fill","description":"对指定路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | 填充路径 | \n","returnValue":"","tutorial":""},"fill_3":{"name":"#### fill(path: Path2D, fillRule: \"nonzero\" \\| \"evenodd\"): void @fill","description":"对指定路径中的内容进行填充","compatibility":"##### fill 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | 填充路径 |\n| fillRule | string | 是 | - | - | 填充当前或已存在的路径的方法。采取非零环绕(nonzero)或者奇偶环绕(evenodd)规则 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nonzero | - | - |\n@| evenodd | - | - | \n","returnValue":"","tutorial":""},"fillRect":{"name":"#### fillRect(x: number, y: number, width: number, height: number): void @fillrect","description":"填充一个矩形。用 setFillStyle 设置矩形的填充色,如果没设置默认是黑色","compatibility":"##### fillRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"fillText":{"name":"#### fillText(text: string, x: number, y: number, maxWidth?: number): void @filltext","description":"在画布上绘制文本","compatibility":"##### fillText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲染的文本字符串 |\n| x | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| y | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| maxWidth | number | 否 | - | - | 需要绘制的最大宽度 | \n","returnValue":"","tutorial":""},"getImageData":{"name":"#### getImageData(sx: number, sy: number, sw: number, sh: number): ImageData @getimagedata","description":"返回一个ImageData对象,用来描述 canvas 区域隐含的像素数据,这个区域通过矩形表示,起始点为*(sx, sy)、宽为sw、高为sh。","compatibility":"##### getImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| sx | number | 是 | - | - | 将要被提取的图像数据矩形区域的左上角 x 坐标 |\n| sy | number | 是 | - | - | 将要被提取的图像数据矩形区域的左上角 y 坐标 |\n| sw | number | 是 | - | - | 将要被提取的图像数据矩形区域的宽度 |\n| sh | number | 是 | - | - | 将要被提取的图像数据矩形区域的高度 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| **ImageData** | 描述canvas元素的一个隐含像素数据的区域 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - | \n","tutorial":""},"isContextLost":{"name":"#### isContextLost(): Boolean @iscontextlost","description":"返回一个Boolean 标记上下文是否已经丢失","compatibility":"##### isContextLost 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| Boolean |\n \n","tutorial":""},"isPointInPath":{"name":"#### isPointInPath(x: number, y: number): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_1":{"name":"#### isPointInPath(x: number, y: number, fillRule: string): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 |\n| fillRule | string | 是 | - | - | 用来决定点在路径内还是在路径外的算法 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_2":{"name":"#### isPointInPath(path: Path2D, x: number, y: number): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInPath_3":{"name":"#### isPointInPath(path: Path2D, x: number, y: number, fillRule: string): boolean @ispointinpath","description":"判断在当前路径中是否包含检测点","compatibility":"##### isPointInPath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 |\n| fillRule | string | 是 | - | - | 用来决定点在路径内还是在路径外的算法 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInStroke":{"name":"#### isPointInStroke(x: number, y: number): boolean @ispointinstroke","description":"检测某点是否在路径的描边线","compatibility":"##### isPointInStroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"isPointInStroke_1":{"name":"#### isPointInStroke(path: Path2D, x: number, y: number): boolean @ispointinstroke","description":"检测某点是否在路径的描边线","compatibility":"##### isPointInStroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | Path2D应用的路径 |\n| x | number | 是 | - | - | 检测点的 X 坐标 |\n| y | number | 是 | - | - | 检测点的 Y 坐标 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"getLineDash":{"name":"#### getLineDash(): Array\\ @getlinedash","description":"在填充线时使用虚线模式, 它使用一组值来指定描述模式的线和间隙的交替长度。注意App平台和Web平台绘制效果有差异","compatibility":"##### getLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| number[\\] |\n \n","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"增加一个新点,然后创建一条从上次指定点到目标点的线。用 stroke 方法来画线条","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 目标位置的 x 坐标 |\n| y | number | 是 | - | - | 目标位置的 y 坐标 | \n","returnValue":"","tutorial":""},"measureText":{"name":"#### measureText(text: string): TextMetrics @measuretext","description":"测量文本尺寸信息。目前仅返回文本宽度","compatibility":"##### measureText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲测量的文本字符串 | \n","returnValue":"##### 返回值 \n\n| 类型 | 描述 |\n| :- | :- |\n| **TextMetrics** | 表示文本的尺寸,通过 CanvasRenderingContext2D.measureText() 方法创建 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| width | number | 是 | - | - | - | \n","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"把路径移动到画布中的指定点","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 目标位置的 x 坐标 |\n| y | number | 是 | - | - | 目标位置的 y 坐标 | \n","returnValue":"","tutorial":""},"putImageData":{"name":"#### putImageData(imageData: ImageData, x: number, y: number): boolean @putimagedata","description":"将数据从已有的 ImageData 对象绘制到位图的方法。如果提供了一个绘制过的矩形,则只绘制该矩形的像素。此方法不受画布转换矩阵的影响","compatibility":"##### putImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageData | **ImageData** | 是 | - | | 包含像素值的数组对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - |\n| x | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(x 轴方向的偏移量) |\n| y | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(y 轴方向的偏移量) | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"putImageData_1":{"name":"#### putImageData(imageData: ImageData, x: number, y: number, dirtyX: number, dirtyY: number, dirtyWidth: number, dirtyHeight: number): boolean @putimagedata","description":"将数据从已有的 ImageData 对象绘制到位图的方法。如果提供了一个绘制过的矩形,则只绘制该矩形的像素。此方法不受画布转换矩阵的影响","compatibility":"##### putImageData 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| imageData | **ImageData** | 是 | - | | 包含像素值的数组对象 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n@| width | number | 是 | - | - | - |\n@| height | number | 是 | - | - | - |\n| x | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(x 轴方向的偏移量) |\n| y | number | 是 | - | - | 源图像数据在目标画布中的位置偏移量(y 轴方向的偏移量) |\n| dirtyX | number | 是 | - | - | 在源图像数据中,矩形区域左上角的位置。默认是整个图像数据的左上角(x 坐标) |\n| dirtyY | number | 是 | - | - | 在源图像数据中,矩形区域左上角的位置。默认是整个图像数据的左上角(y 坐标) |\n| dirtyWidth | number | 是 | - | - | 在源图像数据中,矩形区域的宽度。默认是图像数据的宽度) |\n| dirtyHeight | number | 是 | - | - | 在源图像数据中,矩形区域的高度。默认是图像数据的高度 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"quadraticCurveTo":{"name":"#### quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void @quadraticcurveto","description":"创建二次贝塞尔曲线路径","compatibility":"##### quadraticCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cpx | number | 是 | - | - | 贝塞尔控制点的 x 坐标 |\n| cpy | number | 是 | - | - | 贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形路径起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形路径起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形路径的宽度 |\n| height | number | 是 | - | - | 矩形路径的高度 | \n","returnValue":"","tutorial":""},"resetTransform":{"name":"#### resetTransform(): void @resettransform","description":"使用单位矩阵重新设置当前变换","compatibility":"##### resetTransform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"restore":{"name":"#### restore(): void @restore","description":"恢复之前保存的绘图上下文","compatibility":"##### restore 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"rotate":{"name":"#### rotate(rotate: number): void @rotate","description":"以原点为中心顺时针旋转当前坐标轴","compatibility":"##### rotate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| rotate | number | 是 | - | - | ,以弧度计 degrees * Math.PI/180;degrees 范围为 0-360 | \n","returnValue":"","tutorial":""},"roundRect":{"name":"#### roundRect(x: number, y: number, width: number, height: number, radii: any): boolean @roundrect","description":"在当前路径中添加一个圆角矩形","compatibility":"##### roundRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 包含像素值的数组对象 |\n| y | number | 是 | - | - | 矩形起点的 x 轴坐标,以像素为单位 |\n| width | number | 是 | - | - | 矩形起点的 y 轴坐标,以像素为单位 |\n| height | number | 是 | - | - | 矩形的宽度。正值向右,负值向左 |\n| radii | any | 是 | - | - | 矩形的高度。正值向下,负值向上 | \n","returnValue":"##### 返回值 \n\n| 类型 |\n| :- |\n| boolean |\n \n","tutorial":""},"save":{"name":"#### save(): void @save","description":"保存绘图上下文","compatibility":"##### save 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"scale":{"name":"#### scale(x: number, y: number): void @scale","description":"缩放变换","compatibility":"##### scale 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | |\n| y | number | 是 | - | - | | \n","returnValue":"","tutorial":""},"setLineDash":{"name":"#### setLineDash(segments: Array\\): void @setlinedash","description":"在填充线时使用虚线模式, 它使用一组值来指定描述模式的线和间隙的交替长度。","compatibility":"##### setLineDash 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| segments | number[\\] | 是 | - | - | \\一组描述交替绘制线段和间距(坐标空间单位)长度的数字 | \n","returnValue":"","tutorial":""},"setTransform":{"name":"#### setTransform(scaleX: Number, skewY: Number, skewX: Number, scaleY: Number, translateX: Number, translateY: Number): void @settransform","description":"使用单位矩阵重新设置(覆盖)当前的变换并调用变换","compatibility":"##### setTransform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| scaleX | Number | 是 | - | - | 水平缩放 |\n| skewY | Number | 是 | - | - | 垂直倾斜 |\n| skewX | Number | 是 | - | - | 水平倾斜 |\n| scaleY | Number | 是 | - | - | 垂直缩放 |\n| translateX | Number | 是 | - | - | 水平移动 |\n| translateY | Number | 是 | - | - | 垂直移动 | \n","returnValue":"","tutorial":""},"stroke":{"name":"#### stroke(): void @stroke","description":"画出当前路径的边框。默认颜色色为黑色","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"stroke_1":{"name":"#### stroke(path: Path2D): void @stroke","description":"画出指定路径的边框。默认颜色色为黑色","compatibility":"##### stroke 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| path | [Path2D](/api/path2d.md) | 是 | - | | | \n","returnValue":"","tutorial":""},"strokeRect":{"name":"#### strokeRect(x: number, y: number, width: number, height: number): void @strokerect","description":"画一个矩形(非填充)","compatibility":"##### strokeRect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形的宽度 |\n| height | number | 是 | - | - | 矩形的高度 | \n","returnValue":"","tutorial":""},"strokeText":{"name":"#### strokeText(text: string, x: number, y: number, maxWidth?: number): void @stroketext","description":"文本描边","compatibility":"##### strokeText 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| text | string | 是 | - | - | 要渲染的文本字符串 |\n| x | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| y | number | 是 | - | - | 开始绘制文本的点的 X 轴坐标 |\n| maxWidth | number | 否 | - | - | 需要绘制的最大宽度 | \n","returnValue":"","tutorial":""},"transform":{"name":"#### transform(scaleX: Number, skewY: number, skewX: number, scaleY: number, translateX: number, translateY: number): void @transform","description":"使用矩阵多次叠加当前变换,矩阵由方法的参数进行描述。可以缩放、旋转、移动和倾斜上下文","compatibility":"##### transform 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| scaleX | Number | 是 | - | - | 水平缩放 |\n| skewY | number | 是 | - | - | 垂直倾斜 |\n| skewX | number | 是 | - | - | 水平倾斜 |\n| scaleY | number | 是 | - | - | 垂直缩放 |\n| translateX | number | 是 | - | - | 水平移动 |\n| translateY | number | 是 | - | - | 垂直移动 | \n","returnValue":"","tutorial":""},"translate":{"name":"#### translate(translateX: number, translateY: number): void @translate","description":"当前网格添加平移变换","compatibility":"##### translate 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| translateX | number | 是 | - | - | 水平方向的移动距离 |\n| translateY | number | 是 | - | - | 垂直方向的移动距离 | \n","returnValue":"","tutorial":""}},"compatibility":"### CanvasRenderingContext2D 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"CanvasGradient":{"name":"## CanvasGradient","description":"表示描述渐变的不透明对象。该接口通过 CanvasRenderingContext2D.createLinearGradient()、
CanvasRenderingContext2D.createConicGradient()
或 CanvasRenderingContext2D.createRadialGradient() 方法返回","extends":"","param":"","methods":{"addColorStop":{"name":"#### addColorStop(stop: number, color: string): void @addcolorstop","description":"添加颜色的渐变点。小于最小 stop 的部分会按最小 stop 的 color 来渲染,大于最大 stop 的部分会按最大 stop 的 color 来渲染","compatibility":"##### addColorStop 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| stop | number | 是 | - | - | 表示渐变中开始与结束之间的位置,范围 0-1 |\n| color | string | 是 | - | - | 渐变点的颜色 | \n","returnValue":"","tutorial":""}},"compatibility":"### CanvasGradient 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"Path2D":{"name":"## Path2D","description":"Path2D用来声明路径,用来在canvas中根据需要创建可以保留并重用的路径, 此路径会被CanvasRenderingContext2D对象使用","extends":"","param":"","methods":{"closePath":{"name":"#### closePath(): void @closepath","description":"闭合路径,将最后一个点与起点连接起来。如果图形已经封闭,或者只有一个点,那么此方法不会产生任何效果。","compatibility":"##### closePath 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"","returnValue":"","tutorial":""},"moveTo":{"name":"#### moveTo(x: number, y: number): void @moveto","description":"将一个新的路径的起始点移动到 (x,y) 坐标","compatibility":"##### moveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 点的X轴坐标 |\n| y | number | 是 | - | - | 点的Y轴坐标 | \n","returnValue":"","tutorial":""},"lineTo":{"name":"#### lineTo(x: number, y: number): void @lineto","description":"将路径的最后一个点连接到 (x,y) 坐标","compatibility":"##### lineTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 线终点的X轴坐标 |\n| y | number | 是 | - | - | 线终点的Y轴坐标 | \n","returnValue":"","tutorial":""},"bezierCurveTo":{"name":"#### bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void @beziercurveto","description":"创建三次方贝塞尔曲线路径","compatibility":"##### bezierCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cp1x | number | 是 | - | - | 第一个贝塞尔控制点的 x 坐标 |\n| cp1y | number | 是 | - | - | 第一个贝塞尔控制点的 y 坐标 |\n| cp2x | number | 是 | - | - | 第二个贝塞尔控制点的 x 坐标 |\n| cp2y | number | 是 | - | - | 第二个贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"quadraticCurveTo":{"name":"#### quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void @quadraticcurveto","description":"创建二次贝塞尔曲线路径","compatibility":"##### quadraticCurveTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| cpx | number | 是 | - | - | 贝塞尔控制点的 x 坐标 |\n| cpy | number | 是 | - | - | 贝塞尔控制点的 y 坐标 |\n| x | number | 是 | - | - | 结束点的 x 坐标 |\n| y | number | 是 | - | - | 结束点的 y 坐标 | \n","returnValue":"","tutorial":""},"arc":{"name":"#### arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @arc","description":"绘制一段弧线","compatibility":"##### arc 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 圆弧中心(圆心)的 x 轴坐标 |\n| y | number | 是 | - | - | 圆弧中心(圆心)的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 |\n| startAngle | number | 是 | - | - | 圆弧的起始点,x 轴方向开始计算,单位为弧度 |\n| endAngle | number | 是 | - | - | 圆弧的终点,单位为弧度 |\n| anticlockwise | boolean | 是 | true | - | 圆弧绘制方向,true:逆时针绘制,false:顺时针绘制。 | \n","returnValue":"","tutorial":""},"arcTo":{"name":"#### arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void @arcto","description":"根据控制点和半径绘制圆弧路径,使用当前的描点 (前一个 moveTo 或 lineTo 等函数的止点)。根据当前描点与给定的控制点 1 连接的直线,和控制点 1 与控制点 2 连接的直线,作为使用指定半径的圆的切线,画出两条切线之间的弧线路径","compatibility":"##### arcTo 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x1 | number | 是 | - | - | 第一个控制点的 x 轴坐标 |\n| y1 | number | 是 | - | - | 第一个控制点的 y 轴坐标 |\n| x2 | number | 是 | - | - | 第二个控制点的 x 轴坐标 |\n| y2 | number | 是 | - | - | 第二个控制点的 y 轴坐标 |\n| radius | number | 是 | - | - | 圆弧的半径 | \n","returnValue":"","tutorial":""},"ellipse":{"name":"#### ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise: boolean): void @ellipse","description":"添加椭圆路径。椭圆的圆心在(x,y)位置,半径分别是radiusX 和 radiusY,按照anticlockwise(默认顺时针)指定的方向,从 startAngle 开始绘制,到 endAngle 结束","compatibility":"##### ellipse 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 椭圆圆心的 x 轴(水平)坐标 |\n| y | number | 是 | - | - | 椭圆圆心的 y 轴(垂直)坐标 |\n| radiusX | number | 是 | - | - | 椭圆长轴的半径。必须为非负数 |\n| radiusY | number | 是 | - | - | 椭圆短轴的半径。必须为非负数。 |\n| rotation | number | 是 | - | - | 椭圆的旋转角度,以弧度表示。 |\n| startAngle | number | 是 | - | - | 椭圆弧的起始偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| endAngle | number | 是 | - | - | 椭圆弧的结束偏心角,从正 x 轴沿顺时针测量,用弧度表示。 |\n| anticlockwise | boolean | 是 | - | - | 一个可选的布尔值,如果为 true,则逆时针绘制椭圆弧。默认值为 false(顺时针)。 | \n","returnValue":"","tutorial":""},"rect":{"name":"#### rect(x: number, y: number, width: number, height: number): void @rect","description":"创建一个矩形路径","compatibility":"##### rect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| x | number | 是 | - | - | 矩形路径起点的 x 轴坐标 |\n| y | number | 是 | - | - | 矩形路径起点的 y 轴坐标 |\n| width | number | 是 | - | - | 矩形路径的宽度 |\n| height | number | 是 | - | - | 矩形路径的高度 | \n","returnValue":"","tutorial":""}},"compatibility":"### Path2D 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 4.25 | 4.25 |"},"CanvasPattern":{"name":"## CanvasPattern","description":"接口表示一个不透明对象,描述了一个基于图像、画布或视频的模板,该模板通过 CanvasRenderingContext2D.createPattern() 方法创建","extends":"","param":"","compatibility":"### CanvasPattern 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"ImageData":{"name":"## ImageData","description":"描述canvas元素的一个隐含像素数据的区域","extends":"","param":"\n### ImageData 的属性值 @imagedata-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| data | [Uint8ClampedArray](/uts/buildin-object-api/uint8clampedarray.md) | 是 | - | - | - |\n| width | number | 是 | - | - | - |\n| height | number | 是 | - | - | - |\n","compatibility":"### ImageData 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"TextMetrics":{"name":"## TextMetrics","description":"表示文本的尺寸,通过 CanvasRenderingContext2D.measureText() 方法创建","extends":"","param":"\n### TextMetrics 的属性值 @textmetrics-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| width | number | 是 | - | - | - |\n","compatibility":"### TextMetrics 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.21 | 4.25 | 4.25 |"},"UniResizeObserver":{"name":"## UniResizeObserver","description":"用于监视 UniElement 元素的大小变化。它可以观察一个或多个","extends":"","param":"\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | (entries: Array\\<**UniResizeObserverEntry**\\>) => void | 是 | - | - | 每当监视的元素调整大小时,回调该函数 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n@| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n@| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n@| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n@| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| callback | (entries: Array\\<**UniResizeObserverEntry**\\>, observer: [UniResizeObserver](/dom/uniresizeobserver.md)) => void | 是 | - | - | 每当监视的元素调整大小时,回调该函数 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n@| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n@| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@@| :- | :- | :- | :- | :-: | :- |\n@@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n@| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n@| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n","methods":{"disconnect":{"name":"#### disconnect(): void @disconnect","description":"取消所有的对 UniElement 目标的监视","compatibility":"##### disconnect 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"","returnValue":"","tutorial":""},"observe":{"name":"#### observe(target: UniElement): void @observe","description":"监视指定 UniElement 大小变化","compatibility":"##### observe 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| target | [UniElement](/dom/unielement.md) | 是 | - | | 被监视的 UniElement | \n","returnValue":"","tutorial":""},"unobserve":{"name":"#### unobserve(target: UniElement): void @unobserve","description":"结束对指定的 UniElement 的监视","compatibility":"##### unobserve 兼容性 \n| Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |\n","param":"##### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| target | [UniElement](/dom/unielement.md) | 是 | - | | 取消监视的 UniElement | \n","returnValue":"","tutorial":""}},"compatibility":"### UniResizeObserver 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/API/resize-observer/resize-observer.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/API/resize-observer/resize-observer\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\r\n export default {\r\n data() {\r\n return {\r\n outBoxSizeInfo: \"\",\r\n innerBoxSizeInfo: \"\",\r\n offset: 2,\r\n boxDisplay: false,\r\n outBoxElement: null as UniElement | null,\r\n innerBoxElement: null as UniElement | null,\r\n resizeObserver: null as UniResizeObserver | null,\r\n outBoxElementOnResize: false\r\n }\r\n },\r\n onBackPress() : boolean {\r\n if (this.resizeObserver != null) {\r\n this.resizeObserver!.disconnect()\r\n }\r\n return false\r\n },\r\n onReady() {\r\n if (this.resizeObserver == null) {\r\n this.resizeObserver = new UniResizeObserver((entries : Array) => {\r\n\r\n entries.forEach(entry => {\r\n if (entry.target == this.outBoxElement) {\r\n this.outBoxSizeInfo = this.analysisResizeObserverEntry(entry)\r\n this.outBoxElementOnResize = true\r\n } else if (entry.target == this.innerBoxElement) {\r\n this.innerBoxSizeInfo = this.analysisResizeObserverEntry(entry)\r\n }\r\n })\r\n })\r\n this.outBoxElement = uni.getElementById(\"outBox\")\r\n if (this.outBoxElement != null) {\r\n this.resizeObserver!.observe(this.outBoxElement!)\r\n }\r\n this.innerBoxElement = uni.getElementById(\"innerBox\")\r\n if (this.innerBoxElement != null) {\r\n this.resizeObserver!.observe(this.innerBoxElement!)\r\n }\r\n this.boxDisplay = true\r\n }\r\n },\r\n methods: {\r\n innerBoxClick() {\r\n if (this.innerBoxElement != null) {\r\n this.innerBoxElement!.style.setProperty(\"width\", this.innerBoxElement!.offsetWidth + this.offset + 'px')\r\n this.innerBoxElement!.style.setProperty(\"height\", this.innerBoxElement!.offsetWidth + this.offset + 'px')\r\n }\r\n },\r\n outBoxClick() {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElement!.style.setProperty(\"width\", this.outBoxElement!.offsetWidth + this.offset + 'px')\r\n this.outBoxElement!.style.setProperty(\"height\", this.outBoxElement!.offsetWidth + this.offset + 'px')\r\n }\r\n },\r\n revertBoxSize() {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElement!.style.setProperty(\"width\", \"140px\")\r\n this.outBoxElement!.style.setProperty(\"height\", \"140px\")\r\n }\r\n if (this.innerBoxElement != null) {\r\n this.innerBoxElement!.style.setProperty(\"width\", \"80px\")\r\n this.innerBoxElement!.style.setProperty(\"height\", \"80px\")\r\n }\r\n },\r\n //自动化测试专用\r\n setOutBoxMarginLeft(value : string) {\r\n if (this.outBoxElement != null) {\r\n this.outBoxElementOnResize = false\r\n this.outBoxElement!.style.setProperty(\"margin-left\", value)\r\n }\r\n },\r\n toggleDisplay() {\r\n this.boxDisplay = !this.boxDisplay\r\n },\r\n analysisResizeObserverEntry(entry : UniResizeObserverEntry) : string {\r\n const contentBoxSize = entry.contentBoxSize[0]\r\n const borderBoxSize = entry.borderBoxSize[0]\r\n const devicePixelContentBoxSize = entry.devicePixelContentBoxSize[0]\r\n return \"borderBoxSize: \\n{blockSize:\" + borderBoxSize.blockSize + \", inlineSize:\" + borderBoxSize.inlineSize + \"}\\n\" +\r\n \"contentBoxSize: \\n{blockSize:\" + contentBoxSize.blockSize + \", inlineSize:\" + contentBoxSize.inlineSize + \"}\\n\" +\r\n \"devicePixelContentBoxSize: \\n{blockSize:\" + devicePixelContentBoxSize.blockSize + \", inlineSize:\" + devicePixelContentBoxSize.inlineSize + \"}\\n\" +\r\n \"contentRect: \\n{x:\" + entry.contentRect.x + \", y:\" + entry.contentRect.y + \", width:\" + entry.contentRect.width + \", height:\" + entry.contentRect.height + \"}\"\r\n },\n cancelListen(){\n // this.resizeObserver?.unobserve()\n this.resizeObserver!.unobserve(this.outBoxElement!)\n this.resizeObserver!.unobserve(this.innerBoxElement!)\n },\n goOnListen(){\n this.resizeObserver!.observe(this.outBoxElement!)\n this.resizeObserver!.observe(this.innerBoxElement!)\n }\r\n }\r\n }\r\n\n```\n:::"},"UniResizeObserverEntry":{"name":"## UniResizeObserverEntry","description":"UniResizeObserverEntry 接口是传递给 UniResizeObserver() 构造函数中的回调函数参数的对象","extends":"","param":"\n### UniResizeObserverEntry 的属性值 @uniresizeobserverentry-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| borderBoxSize | Array\\<**UniBorderBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素带有边框box大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n| contentBoxSize | Array\\<**UniContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n| devicePixelContentBoxSize | Array\\<**UniDevicePixelContentBoxSize**\\> | 是 | - | | 只读属性 包含被监视的元素内容box设备像素大小的数组。 |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n@| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n| contentRect | [DOMRect](/dom/domrect.md) | 是 | - | - | 只读属性 包含被监视元素大小的DOMRect |\n| target | [UniElement](/dom/unielement.md) | 是 | - | - | 只读属性 被监视的 UniElement |\n","compatibility":"### UniResizeObserverEntry 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniBorderBoxSize":{"name":"## UniBorderBoxSize","description":"被监视的元素带有边框box的大小","extends":"","param":"\n### UniBorderBoxSize 的属性值 @uniborderboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素含边框box的高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素含边框box的宽度 |\n","compatibility":"### UniBorderBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniContentBoxSize":{"name":"## UniContentBoxSize","description":"被监视的元素内容box的大小","extends":"","param":"\n### UniContentBoxSize 的属性值 @unicontentboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的宽度 |\n","compatibility":"### UniContentBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniDevicePixelContentBoxSize":{"name":"## UniDevicePixelContentBoxSize","description":"被监视的元素内容box的设备像素大小","extends":"","param":"\n### UniDevicePixelContentBoxSize 的属性值 @unidevicepixelcontentboxsize-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| blockSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素高度 |\n| inlineSize | number | 是 | - | - | 只读属性,被监视元素内容box的设备像素宽度 |\n","compatibility":"### UniDevicePixelContentBoxSize 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| 4.16 | 4.13 | 4.18 |"},"UniError":{"name":"## UniError","description":"uni api统一错误信息对象 ","extends":"","param":"\n### 构造函数\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | 统一错误描述信息 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | 统一错误描述信息 |\n| options | any | 是 | - | - | 源错误对象,原始错误对象应该包含在 options.cause 属性中 |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errSubject | string | 是 | - | - | 统一错误主题(模块)名称 |\n| errCode | number | 是 | - | - | 统一错误码 |\n| errMsg | string | 是 | - | - | 统一错误描述信息 |\n\n### UniError 的属性值 @unierror-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| errSubject | string | 是 | - | - | 统一错误主题(模块)名称 |\n| errCode | number | 是 | - | - | 统一错误码 |\n| errMsg | string | 是 | - | - | 统一错误描述信息 |\n| data | any | 否 | - | - | 错误信息中包含的数据 |\n| cause | [Error](https://uniapp.dcloud.net.cn/tutorial/err-spec.html#unierror) | 否 | - | - | 源错误信息,可以包含多个错误,详见SourceError |\n| name | string | 是 | - | - | - |\n| message | string | 是 | - | - | - |\n","compatibility":"### UniError 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"Error":{"name":"## Error","description":"UTS错误信息对象","extends":"","param":"\n### 构造函数\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | - |\n\n### 构造函数\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| message | string | 是 | - | - | - |\n| options | any | 是 | - | - | - |\n\n### Error 的属性值 @error-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| name | string | 是 | - | - | - |\n| message | string | 是 | - | - | - |\n| cause | [Error](https://uniapp.dcloud.net.cn/tutorial/err-spec.html#unierror) | 否 | - | - | - |\n","compatibility":"### Error 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | - | - |"},"UniProvider":{"name":"## UniProvider","description":"服务供应商","extends":"","param":"\n### UniProvider 的属性值 @uniprovider-values\n| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| id | string | 是 | - | - | 服务供应商标识 |\n| description | string | 是 | - | - | 服务供应商描述 |\n| ~~isAppExist~~ | boolean | 是 | - | - | 判断服务供应商依赖的App是否安装(仅支持微信支付) |\n","compatibility":"### UniProvider 兼容性 \n | Web | Android | iOS |\n| :- | :- | :- |\n| - | 4.18 | 4.18 |"},"general-attribute":{"name":"组件公共属性","description":"","attribute":"| 名称 | 类型 | 描述 |\n| :- | :- | :- |\n| id | string(string.IDString) | 组件的唯一标识。需避免同页面中不同组件设置重复id;需避免使用uni-、uni.等前缀 |\n| style | string | 组件的内联样式,可以动态设置的内联样式 |\n| class | string(string.ClassString) | 组件的样式类,在对应的 css 中定义的样式类 |\n| ref | string | vue中组件的唯一标识,用来给子组件注册引用信息,[详见](https://doc.dcloud.net.cn/uni-app-x/vue/built-in.html#ref) |\n| data-* | any | 自定义属性,组件上触发的事件时,会发送给事件处理函数 |\n| android-* | any | App-Android平台专有属性,详见[App-Android平台专有属性](https://doc.dcloud.net.cn/uni-app-x/component/common.html#attribute-android)章节 |","compatibility":"| | Web | Android | iOS |\n| :- | :- | :- | :- |\n| id | 4.0 | 3.9 | 4.11 |\n| style | 4.0 | 3.9 | 4.11 |\n| class | 4.0 | 3.9 | 4.11 |\n| ref | 4.0 | 3.9 | 4.11 |\n| data-* | 4.0 | 3.9 | 4.11 |\n| android-* | x | 3.9 | x |"},"general-event":{"name":"组件公共事件","description":"","attribute":"| 名称 | 类型 | 描述 |\n| :- | :- | :- |\n| @click | (event: [UniPointerEvent](/component/common.md#unipointerevent)) => void | 手指触摸后马上离开。与tap相同,(推荐使用tap事件代替),冒泡事件 |\n| @mousedown | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标在元素上点击后触发 |\n| @mousemove | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标在元素上移动时触发 |\n| @mouseup | (event: [UniMouseEvent](/component/common.md#unimouseevent)) => void | 鼠标主按钮在元素上松开时触发 |\n| @touchstart | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作开始,冒泡事件,event.type 值为 touchstart |\n| @touchmove | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸后移动,冒泡事件,event.type 值为 touchmove |\n| @touchcancel | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作被打断,如来电提醒,弹窗,冒泡事件,event.type 值为 touchcancel |\n| @touchend | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸动作结束,冒泡事件,event.type 值为 touchend |\n| @tap | (event: [UniPointerEvent](/component/common.md#unipointerevent)) => void | 手指触摸后马上离开,冒泡事件 |\n| @longpress | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 如果一个组件被绑定了 longpress 事件,那么当用户手指触摸后,超过350ms再离开会触发,冒泡事件 |\n| @longtap | (event: [UniTouchEvent](/component/common.md#unitouchevent)) => void | 手指触摸后,超过350ms再离开(推荐使用 longpress 事件代替) |\n| @transitionend | (event: [UniEvent](/component/common.md#unievent)) => void | transition 效果结束时触发 |","compatibility":"| | Web | Android | iOS |\n| :- | :- | :- | :- |\n| @click | 4.0 | 3.9 | 4.11 |\n| @mousedown | 4.0 | x | x |\n| @mousemove | 4.0 | x | x |\n| @mouseup | 4.0 | x | x |\n| @touchstart | 4.0 | 3.9 | 4.11 |\n| @touchmove | 4.0 | 3.9 | 4.11 |\n| @touchcancel | 4.0 | 3.9 | 4.11 |\n| @touchend | 4.0 | 3.9 | 4.11 |\n| @tap | 4.0 | 3.9 | 4.11 |\n| @longpress | 4.0 | 3.9 | 4.11 |\n| @longtap | 4.0 | 3.9 | 4.11 |\n| @transitionend | 4.0 | 3.93 | 4.11 |"}} \ No newline at end of file diff --git a/docs/.vuepress/utils/utsComJson.json b/docs/.vuepress/utils/utsComJson.json index a729872f..a77645ec 100644 --- a/docs/.vuepress/utils/utsComJson.json +++ b/docs/.vuepress/utils/utsComJson.json @@ -1 +1 @@ -{"view":{"name":"## view","description":"> 组件类型:UniViewElement \n\n 基本视图容器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| hover-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"none\" | | 指定按下去的样式类。当 hover-class=\"none\" 时,没有点击态效果 |\n| hover-stop-propagation | boolean | false | | 指定是否阻止本节点的祖先节点出现点击态(祖先节点:指根节点到该节点路径上的所有节点都是这个节点的祖先节点) |\n| hover-start-time | number | 50 | | 按住后多久出现点击态,单位毫秒 |\n| hover-stay-time | number | 400 | | 手指松开后点击态保留时间,单位毫秒 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/view/view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/view/view\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n import { ItemType } from '@/components/enum-data/enum-data'\n export default {\n data() {\n return {\n hover_class: false,\n stop_propagation: false,\n start_time: 50,\n stay_time: 400,\n start_time_enum: [{ \"value\": 50, \"name\": \"50毫秒\" }, { \"value\": 200, \"name\": \"200毫秒\" }] as ItemType[],\n stay_time_enum: [{ \"value\": 400, \"name\": \"400毫秒\" }, { \"value\": 200, \"name\": \"200毫秒\" }] as ItemType[]\n }\n },\n methods: {\n change_hover_class_boolean(checked : boolean) {\n this.hover_class = checked\n },\n change_stop_propagation_boolean(checked : boolean) {\n this.stop_propagation = checked\n },\n radio_change_start_time_enum(time : number) {\n this.start_time = time\n },\n radio_change_stay_time_enum(time : number) {\n this.stay_time = time\n },\n },\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"scroll-view":{"name":"## scroll-view","description":"> 组件类型:UniScrollViewElement \n\n 可滚动视图容器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| type | string | - | | 渲染模式,可取值 nested |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nested | | 嵌套模式。用于处理父子 scroll-view 间的嵌套滚动,子节点只能是 nested-scroll-header nested-scroll-body 组件或自定义 refresher |\n| direction | string | \"vertical\" | | 滚动方向,可取值 none、all、horizontal、vertical,默认值vertical |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| none | | 禁止滚动 |\n@| all | | 横向竖向都可滚动 app端不支持 |\n@| horizontal | | 横向滚动 |\n@| vertical | | 竖向滚动 |\n| associative-container | string | \"\" | | 关联的滚动容器 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nested-scroll-view | | 嵌套滚动 |\n| enable-back-to-top | boolean | false | | iOS点击顶部状态栏滚动条返回顶部,只支持竖向 |\n| bounces | boolean | true | | 控制是否回弹效果 优先级高于rebound |\n| upper-threshold | number | 50 | | 距顶部/左边多远时(单位px),触发 scrolltoupper 事件 |\n| lower-threshold | number | 50 | | 距底部/右边多远时(单位px),触发 scrolltolower 事件 |\n| scroll-top | number | 0 | | 设置竖向滚动条位置 |\n| scroll-left | number | 0 | | 设置横向滚动条位置 |\n| scroll-into-view | string([string.IDString](/uts/data-type.md#ide-string)) | - | | 值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素起始位置 |\n| scroll-with-animation | boolean | false | | 是否在设置滚动条位置时使用滚动动画,设置false没有滚动动画 |\n| refresher-enabled | boolean | false | | 开启下拉刷新,暂时不支持scroll-x = true横向刷新 |\n| refresher-threshold | number | 45 | | 设置下拉刷新阈值 |\n| refresher-max-drag-distance | number | - | | 设置下拉最大拖拽距离(单位px),默认是下拉刷新控件高度的2.5倍 |\n| refresher-default-style | string | \"black\" | | 设置下拉刷新默认样式,支持设置 black \\| white \\| none, none 表示不使用默认样式 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| black | | 深颜色雪花样式 |\n@| white | | 浅白色雪花样式 |\n@| none | | 不使用默认样式 |\n| refresher-background | string([string.ColorString](/uts/data-type.md#ide-string)) | \"transparent\" | | 设置下拉刷新区域背景颜色,默认透明 |\n| refresher-triggered | boolean | false | | 设置当前下拉刷新状态,true 表示下拉刷新已经被触发,false 表示下拉刷新未被触发 |\n| show-scrollbar | boolean | true | | 控制是否出现滚动条 |\n| custom-nested-scroll | boolean | false | | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| nested-scroll-child | string([string.IDString](/uts/data-type.md#ide-string)) | \"\" | | 嵌套滚动子元素的id属性,不支持ref,scroll-view惯性滚动时会让对应id元素视图进行滚动,子元素滚动时会触发scroll-view的nestedprescroll事件,嵌套子元素需要设置custom-nested-scroll = true |\n| @refresherpulling | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被触发 |\n| @refresherrestore | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被复位 |\n| @refresherabort | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被中止 |\n| @scrolltoupper | (event: [UniScrollToUpperEvent](#uniscrolltoupperevent)) => void | - | | 滚动到顶部/左边,会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [UniScrollToLowerEvent](#uniscrolltolowerevent)) => void | - | | 滚动到底部/右边,会触发 scrolltolower 事件 |\n| @scroll | (event: [UniScrollEvent](#uniscrollevent)) => void | - | | 滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| @scrollend | (event: [UniScrollEvent](#uniscrollevent)) => void | - | | 滚动结束时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| @startnestedscroll | (event: [UniStartNestedScrollEvent](#unistartnestedscrollevent)) => Boolean | - | | 子元素开始滚动时触发, return true表示与子元素开启滚动协商 默认return false! event = {node} |\n| @nestedprescroll | (event: [UniNestedPreScrollEvent](#uninestedprescrollevent)) => void | - | | 子元素滚动时触发,可执行event.consumed(x,y)告知子元素deltaX、deltaY各消耗多少。子元素将执行差值后的deltaX、deltaY滚动距离。不执行consumed(x,y)则表示父元素不消耗deltaX、deltaY。event = {deltaX, deltaY} |\n| @stopnestedscroll | (event: [UniStopNestedScrollEvent](#unistopnestedscrollevent)) => void | - | | 子元素滚动结束或意外终止时触发 |\n| ~~rebound~~ | boolean | true | | 控制是否回弹效果。已废弃,请改用bounces |\n| ~~scroll-y~~ | boolean | true | | 允许纵向滚动,不支持同时设置scroll-x属性为true,同时设置true时scroll-y生效。已废弃,请改用direction |\n| ~~scroll-x~~ | boolean | false | | 允许横向滚动,不支持同时设置scroll-y属性为true,同时设置true时scroll-y生效。已废弃,请改用direction |","event":"\n### 事件\n#### UniRefresherEvent\n\n```mermaid\ngraph LR\n \nUniRefresherEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniRefresherEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniRefresherEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| dy | number | 是 | - | - | - |\n\n\n#### UniScrollToUpperEvent\n\n```mermaid\ngraph LR\n \nUniScrollToUpperEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollToUpperEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollToUpperEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | string | 是 | - | - | 滚动方向 top 或 left |\n\n\n#### UniScrollToLowerEvent\n\n```mermaid\ngraph LR\n \nUniScrollToLowerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollToLowerEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollToLowerEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | string | 是 | - | - | 滚动方向 bottom 或 right |\n\n\n#### UniScrollEvent\n\n```mermaid\ngraph LR\n \nUniScrollEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| scrollTop | number | 是 | - | - | 竖向滚动的距离 |\n@| scrollLeft | number | 是 | - | - | 横向滚动的距离 |\n@| scrollHeight | number | 是 | - | - | 滚动区域的高度 |\n@| scrollWidth | number | 是 | - | - | 滚动区域的宽度 |\n@| deltaY | number | 是 | - | - | 当次滚动事件竖向滚动量 |\n@| deltaX | number | 是 | - | - | 当次滚动事件横向滚动量 |\n\n\n#### UniStartNestedScrollEvent\n\n```mermaid\ngraph LR\n \nUniStartNestedScrollEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniStartNestedScrollEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| node | [UniElement](/dom/unielement.md) | 是 | - | - | 开始滚动子节点对象 |\n| isTouch | boolean | 是 | - | | 是否由触摸行为发生的Event |\n\n\n#### UniNestedPreScrollEvent\n\n```mermaid\ngraph LR\n \nUniNestedPreScrollEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniNestedPreScrollEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| deltaX | number | 是 | - | - | x轴滚动距离 |\n| deltaY | number | 是 | - | - | y轴滚动距离 |\n| isTouch | boolean | 是 | - | | 是否由触摸行为发生的Event |\n\n\n##### UniNestedPreScrollEvent 的方法\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| consumed | (consumedX: number, consumedY: number) => void | 是 | - | - | 通知到子节点x,y轴滚动距离的消耗 |\n\n#### UniStopNestedScrollEvent\n\n```mermaid\ngraph LR\n \nUniStopNestedScrollEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniStopNestedScrollEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| isTouch | boolean | 是 | - | - | 是否由触摸行为发生的Event |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/scroll-view/scroll-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/scroll-view/scroll-view\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n type ScrollEventTest = {\n type: string;\n target: UniElement | null;\n currentTarget: UniElement | null;\n direction?:string\n }\n export default {\n data() {\n return {\n scrollTop: 0,\n oldScrollTop: 0,\n scrollLeft:120,\n showScrollbar: true,\n // 自动化测试\n isScrollTest:'',\n isScrolltolowerTest:'',\n isScrolltoupperTest:'',\n // 在web端scroll事件event参数中detail类型报错,先条件编译处理\n // #ifndef WEB\n scrollDetailTest:null as UniScrollEventDetail|null,\n scrollEndDetailTest:null as UniScrollEventDetail|null,\n // #endif\n }\n },\n methods: {\n upper: function (e : UniScrollToUpperEvent) {\n console.log('滚动到顶部/左边',e)\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget,\n direction:e.detail.direction,\n } as ScrollEventTest,'scrolltoupper')\n },\n lower: function (e : UniScrollToLowerEvent) {\n console.log('滚动到底部/右边',e)\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget,\n direction:e.detail.direction,\n } as ScrollEventTest,'scrolltolower')\n },\n scroll: function (e : UniScrollEvent) {\n // #ifndef WEB\n this.scrollDetailTest = e.detail\n // #endif\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as ScrollEventTest,'scroll')\n this.oldScrollTop = e.detail.scrollTop\n },\n end: function (e : UniScrollEvent){\n console.log('滚动结束时触发',e)\n // #ifndef WEB\n this.scrollEndDetailTest = e.detail\n // #endif\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as ScrollEventTest,'scrollend')\n },\n goTop: function () {\n // 解决view层不同步的问题\n this.scrollTop = this.oldScrollTop\n this.$nextTick(function () {\n this.scrollTop = 0\n })\n uni.showToast({\n icon: 'none',\n title: '纵向滚动 scrollTop 值已被修改为 0',\n })\n },\n // 自动化测试专用(由于事件event参数对象中存在循环引用,在ios端JSON.stringify报错,自动化测试无法page.data获取)\n checkEventTest(e:ScrollEventTest, eventName:String){\n const isPass = e.type === eventName && e.target instanceof UniElement && e.currentTarget instanceof UniElement;\n const result = isPass ? `${eventName}:Success` : `${eventName}:Fail`;\n switch (eventName){\n case 'scroll':\n this.isScrollTest = result\n break;\n case 'scrolltolower':\n this.isScrolltolowerTest = result + `-${e.direction}`\n break;\n case 'scrolltoupper':\n this.isScrolltoupperTest = result + `-${e.direction}`\n break;\n default:\n break;\n }\n },\n },\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.scroll-view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/scroll-view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=scroll-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=scroll-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=scroll-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=scroll-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=scroll-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=scroll-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=scroll-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"swiper-item":{"name":"## swiper-item","description":"> 组件类型:UniSwiperItemElement \n\n swiper的唯一合法子组件。每个swiper-item代表一个滑块。宽高自动设置为100%","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| item-id | string | - | | 该 swiper-item 的标识符 |","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.swiper.swiper-item)\n- [参见uni-app相关文档](https://uniapp.dcloud.net.cn/component/swiper.html#swiper-item)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=swiper-item&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=swiper-item&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=swiper-item&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=swiper-item&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=swiper-item&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=swiper-item)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=swiper-item&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"swiper":{"name":"## swiper","description":"> 组件类型:UniSwiperElement \n\n 滑块视图容器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| indicator-dots | boolean | false | | 是否显示面板指示点 |\n| indicator-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"rgba(0, 0, 0, .3)\" | | 指示点颜色 |\n| indicator-active-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#000000\" | | 当前选中的指示点颜色 |\n| disable-touch | boolean | false | | 是否禁止用户 touch 操作 |\n| autoplay | boolean | false | | 是否自动切换 |\n| current | number | 0 | | 当前所在滑块的 index |\n| current-item-id | string | - | | 当前所在滑块的 item-id ,不能与 current 被同时指定 |\n| interval | number | 3000 | | 自动切换时间间隔 |\n| duration | number | - | | 滑动动画时长 |\n| circular | boolean | false | | 是否采用衔接滑动 |\n| vertical | boolean | false | | 滑动方向是否为纵向 |\n| rebound | boolean | true | | 控制是否回弹效果 |\n| @change | (event: [UniSwiperChangeEvent](#uniswiperchangeevent)) => void | - | | current 改变时会触发 change 事件,event.detail = {current: current, source: source} |\n| @transition | (event: [UniSwiperTransitionEvent](#uniswipertransitionevent)) => void | - | | swiper-item 的位置发生改变时会触发 transition 事件,event.detail = {dx: dx, dy: dy} |\n| @animationfinish | (event: [UniSwiperAnimationFinishEvent](#uniswiperanimationfinishevent)) => void | - | | 动画结束时会触发 animationfinish 事件,event.detail = {current: current, source: source} |","event":"\n### 事件\n#### UniSwiperChangeEvent\n\n```mermaid\ngraph LR\n \nUniSwiperChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniSwiperChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniSwiperChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| current | number | 是 | - | - | 发生change事件的滑块下标 |\n@| currentItemId | string | 否 | - | | 切换结束的 swiper-item 的 item-id 属性值 |\n@| source | string | 是 | - | - | autoplay 自动播放导致swiper变化;touch 用户划动引起swiper变化 |\n\n\n#### UniSwiperTransitionEvent\n\n```mermaid\ngraph LR\n \nUniSwiperTransitionEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniSwiperTransitionEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniSwiperTransitionEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| dx | number | 是 | - | - | 横向偏移量,单位是逻辑像素px |\n@| dy | number | 是 | - | - | 纵向偏移量,单位是逻辑像素px |\n\n\n#### UniSwiperAnimationFinishEvent\n\n```mermaid\ngraph LR\n \nUniSwiperAnimationFinishEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniSwiperAnimationFinishEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniSwiperAnimationFinishEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| current | number | 是 | - | - | 发生动画结束事件的滑块下标 |\n@| currentItemId | string | 否 | - | | 动画结束的 swiper-item 的 item-id 属性值 |\n@| source | string | 是 | - | - | autoplay 自动播放导致swiper变化;touch 用户划动引起swiper变化 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/swiper/swiper.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/swiper/swiper\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\n type SwiperEventTest = {\n type: string;\n target: UniElement | null;\n currentTarget: UniElement | null;\n }\r\n export default {\r\n data() {\r\n return {\r\n background: ['color1', 'color2', 'color3'],\r\n dotsSelect: false,\r\n reboundSelect: false,\r\n autoplaySelect: false,\r\n circularSelect: false,\r\n indicatorColorSelect: false,\r\n verticalSelect: false,\r\n currentSelect: false,\r\n currentItemIdSelect: false,\r\n intervalSelect: 2000,\r\n indicatorColor: \"\",\r\n indicatorColorActive: \"\",\r\n currentVal: 0,\r\n currentItemIdVal: \"\",\r\n disableTouchSelect: false,\r\n swiperTransitionSelect: false,\r\n swiperAnimationfinishSelect: false,\r\n swiperChangeSelect: false,\r\n currentValChange: 0,\n // 自动化测试\n changeDetailTest:null as UniSwiperChangeEventDetail | null,\n transitionDetailTest:null as UniSwiperTransitionEventDetail | null,\n animationfinishDetailTest:null as UniSwiperAnimationFinishEventDetail | null,\n isChangeTest:'',\n isTransitionTest:'',\n isAnimationfinishTest:''\n }\r\n },\n methods: {\r\n swiperChange: function (e : UniSwiperChangeEvent) {\n this.changeDetailTest = e.detail\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as SwiperEventTest,'change')\n this.currentValChange = e.detail.current\r\n console.log(this.currentValChange)\r\n if (this.swiperChangeSelect) {\r\n console.log(\"swiperChange\")\r\n console.log(e)\r\n }\r\n },\r\n swiperTransition: function (e : UniSwiperTransitionEvent) {\n this.transitionDetailTest = e.detail\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as SwiperEventTest,'transition')\n if (this.swiperTransitionSelect) {\r\n console.log(\"swiperTransition\")\r\n console.log(e)\r\n }\r\n },\r\n swiperAnimationfinish: function (e : UniSwiperAnimationFinishEvent) {\n this.animationfinishDetailTest = e.detail\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as SwiperEventTest,'animationfinish')\n if (this.swiperAnimationfinishSelect) {\r\n console.log(\"swiperAnimationfinish\")\r\n console.log(e)\r\n }\r\n },\r\n // 自动化测试专用(由于事件event参数对象中存在循环引用,在ios端JSON.stringify报错,自动化测试无法page.data获取)\n checkEventTest(e:SwiperEventTest, eventName:String){\n const isPass = e.type === eventName && e.target instanceof UniElement && e.currentTarget instanceof UniElement;\n const result = isPass ? `${eventName}:Success` : `${eventName}:Fail`;\n switch (eventName){\n case 'change':\n this.isChangeTest = result\n break;\n case 'transition':\n this.isTransitionTest = result\n break;\n case 'animationfinish':\n this.isAnimationfinishTest = result\n break;\n default:\n break;\n }\n },\r\n dotsChange: function (e : UniSwitchChangeEvent) {\r\n this.dotsSelect = e.detail.value\r\n },\r\n swiperTransitionChange: function (e : UniSwitchChangeEvent) {\r\n this.swiperTransitionSelect = e.detail.value\r\n },\r\n swiperChangeChange: function (e : UniSwitchChangeEvent) {\r\n this.swiperChangeSelect = e.detail.value\r\n },\r\n swiperAnimationfinishChange: function (e : UniSwitchChangeEvent) {\r\n this.swiperAnimationfinishSelect = e.detail.value\r\n },\r\n autoplayChange: function (e : UniSwitchChangeEvent) {\n this.autoplaySelect = e.detail.value\r\n },\r\n verticalChange: function (e : UniSwitchChangeEvent) {\r\n this.verticalSelect = e.detail.value\r\n },\r\n disableTouchChange: function (e : UniSwitchChangeEvent) {\r\n this.disableTouchSelect = e.detail.value\r\n },\r\n currentItemIdChange: function (e : UniSwitchChangeEvent) {\r\n this.currentItemIdSelect = e.detail.value\r\n if (this.currentItemIdSelect) {\r\n this.currentItemIdVal = 'C'\r\n } else {\r\n this.currentItemIdVal = 'A'\r\n }\r\n },\r\n currentChange: function (e : UniSwitchChangeEvent) {\r\n this.currentSelect = e.detail.value\r\n if (this.currentSelect) {\r\n this.currentVal = 2\r\n } else {\r\n this.currentVal = 0\r\n }\r\n\r\n },\r\n circularChange: function (e : UniSwitchChangeEvent) {\r\n this.circularSelect = e.detail.value\r\n console.log(this.circularSelect)\r\n },\r\n reboundSelectChange: function (e : UniSwitchChangeEvent) {\r\n this.reboundSelect = e.detail.value\r\n console.log(this.reboundSelect)\r\n },\r\n sliderChange(e : UniSliderChangeEvent) {\r\n this.intervalSelect = e.detail.value\r\n },\r\n indicatorColorChange(e : UniSwitchChangeEvent) {\r\n this.indicatorColorSelect = e.detail.value\r\n if (this.indicatorColorSelect) {\r\n // 选择了定制指示器颜色\r\n this.indicatorColor = \"#ff00ff\"\r\n this.indicatorColorActive = \"#0000ff\"\r\n } else {\r\n // 没有选择颜色\r\n this.indicatorColor = \"\"\r\n this.indicatorColorActive = \"\"\r\n }\r\n }\r\n }\r\n }\r\n\n```\n:::","children":"### 子组件 @children-tags \n - [swiper-item](swiper-item.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.swiper.swiper)\n- [参见uni-app相关文档](https://uniapp.dcloud.net.cn/component/swiper.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=swiper&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=swiper&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=swiper&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=swiper&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=swiper&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=swiper)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=swiper&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"match-media":{"name":"## match-media","description":"media query 匹配检测节点","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| width | number | - | | 页面宽度(px 为单位) |\n| min-width | number | - | | 页面最小宽度(px 为单位) |\n| max-width | number | - | | 页面最大宽度(px 为单位) |\n| height | number | - | | 页面高度(px 为单位) |\n| min-height | number | - | | 页面最小高度(px 为单位) |\n| max-height | number | - | | 页面最大高度(px 为单位) |\n| orientation | string | - | | 屏幕方向(landscape 或 portrait) |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| vertical | - | - |\n@| horizontal | - | - |","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.match-media)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/match-media.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=match-media&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=match-media&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=match-media&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=match-media&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=match-media&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=match-media)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=match-media&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"movable-area":{"name":"## movable-area","description":"movable-view 的可移动区域","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.movable.movable-area)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/movable-area.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=movable-area&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=movable-area&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=movable-area&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=movable-area&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=movable-area&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=movable-area)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=movable-area&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"movable-view":{"name":"## movable-view","description":"可移动的视图容器,在页面中可以拖拽滑动","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| direction | string | - | | movable-view的移动方向,属性值有all、vertical、horizontal、none |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| all | - | - |\n@| vertical | - | - |\n@| horizontal | - | - |\n@| none | - | - |\n| inertia | boolean | - | | movable-view 是否带有惯性。 |\n| out-of-bounds | boolean | - | | 超过可移动区域后,movable-view 是否还可以移动。 |\n| x | string \\| number | - | | 定义 x 轴方向的偏移,如果 x 的值不在可移动范围内,会自动移动到可移动范围;改变 x 的值会触发动画。 |\n| y | string \\| number | - | | 定义 y 轴方向的偏移,如果 y 的值不在可移动范围内,会自动移动到可移动范围;改变 y 的值会触发动画。 |\n| damping | number | - | | 阻尼系数,用于控制 x 或 y 改变时的动画和过界回弹的动画,值越大移动越快。 |\n| friction | number | - | | 摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值 2。 |\n| disabled | boolean | - | | 是否禁用。 |\n| scale | boolean | - | | 是否支持双指缩放,默认缩放手势生效区域是在 movable-view 内。 |\n| scale-min | number | - | | 定义缩放倍数最小值,默认为 0.5。 |\n| scale-max | number | - | | 定义缩放倍数最大值,默认为 10。 |\n| scale-value | number | - | | 定义缩放倍数,取值范围为 0.5 - 10 |\n| animation | boolean | - | | 是否使用动画,默认为 true。 |\n| @change | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 拖动过程中触发的事件,event.detail = {x: x, y: y, source: source}。其中source表示产生移动的原因,值可为touch(拖动)、touch-out-of-bounds(超出移动范围)、out-of-bounds(超出移动范围后的回弹)、friction(惯性)和空字符串(setData)。 |\n| @scale | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 缩放过程中触发的事件,event.detail = {x: x, y: y, scale: scale}。 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/movable-view/movable-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/movable-view/movable-view\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\tscale: 2,\n\t\t\t\told: {\n\t\t\t\t\tx: 0,\n\t\t\t\t\ty: 0,\n\t\t\t\t\tscale: 2\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\ttap: function(e) {\n\t\t\t\t// 解决view层不同步的问题\n\t\t\t\tthis.x = this.old.x\n\t\t\t\tthis.y = this.old.y\n\t\t\t\tthis.$nextTick(function() {\n\t\t\t\t\tthis.x = 30\n\t\t\t\t\tthis.y = 30\n\t\t\t\t})\n\t\t\t},\n\t\t\ttap2() {\n\t\t\t\t// 解决view层不同步的问题\n\t\t\t\tthis.scale = this.old.scale\n\t\t\t\tthis.scale = this.old.scale\n\t\t\t\tthis.$nextTick(function() {\n\t\t\t\t\tthis.scale = 3\n\t\t\t\t})\n\t\t\t},\n\t\t\tonChange: function(e) {\n\t\t\t\tthis.old.x = e.detail.x\n\t\t\t\tthis.old.y = e.detail.y\n\t\t\t},\n\t\t\tonScale: function(e) {\n\t\t\t\tthis.old.scale = e.detail.scale\n\t\t\t}\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.movable.movable-view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/movable-view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=movable-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=movable-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=movable-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=movable-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=movable-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=movable-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=movable-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"cover-view":{"name":"## cover-view","description":"覆盖在原生组件之上的文本视图,可覆盖的原生组件包括map、video、canvas、camera,只支持嵌套cover-view、cover-image","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/cover-view/cover-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/cover-view/cover-view\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tshowMap: false,\n latitude: 39.909,\n longitude: 116.39742\n\t\t\t};\n\t\t},\n\t\tonLoad() {\n this.showMap = true\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.cover.cover-view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/cover-view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=cover-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=cover-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=cover-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=cover-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=cover-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=cover-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=cover-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"cover-image":{"name":"## cover-image","description":"覆盖在原生组件之上的图片视图,可覆盖的原生组件同cover-view,支持嵌套在cover-view里。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| v-for | Any | - | | - |\n| v-if | Any | - | | - |\n| v-show | Any | - | | - |\n| src | string([string.ImageURIString](/uts/data-type.md#ide-string)) | - | | 图标路径,支持临时路径、网络地址(1.6.0起支持)。暂不支持base64格式。 |","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.cover.cover-image)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/cover-image.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=cover-image&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=cover-image&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=cover-image&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=cover-image&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=cover-image&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=cover-image)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=cover-image&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"list-item":{"name":"## list-item","description":"> 组件类型:UniListItemElement \n\n list-view组件的唯一合法子组件。每个item是一行","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.02 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| type | number | 0 | | 对应list-item的类型 list-view 将对同类型条目进行复用,所以合理的类型拆分,可以很好地提升 list-view 性能 |","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.list-view.list-item)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=list-item&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=list-item&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=list-item&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=list-item&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=list-item&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=list-item)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=list-item&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"sticky-header":{"name":"## sticky-header","description":"> 组件类型:UniStickyHeaderElement \n\n 吸顶布局容器

注意:暂时仅支持作为list-view、sticky-section的子节点, sticky-header不支持css样式!当一个容器视图设置多个sticky-header时,后一个sticky-header会停靠在前一个sticky-header的末尾处。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.02 | 3.93 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| padding | array\\ | [0,0,0,0\\] | | 长度为 4 的数组,按 top、right、bottom、left 顺序指定内边距 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/sticky-header/sticky-header.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/sticky-header/sticky-header\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n sift_item: [\"排序\", \"筛选\"],\n list_item: [] as Array,\n refresher_enabled_boolean: true,\n refresher_triggered_boolean: false,\n scroll_top_input: 0\n }\n },\n onLoad() {\n let lists : Array = []\n for (let i = 0; i < 40; i++) {\n lists.push(\"item---\" + i)\n }\n this.list_item = lists\n },\n methods: {\n list_view_refresherrefresh() {\n console.log(\"下拉刷新被触发 \")\n this.refresher_triggered_boolean = true\n setTimeout(() => {\n this.refresher_triggered_boolean = false\n }, 1500)\n },\n confirm_scroll_top_input(value : number) {\n this.scroll_top_input = value\n },\n clickTH(index : number) {\n console.log(\"点击表头:\" + index);\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.sticky.sticky-header)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=sticky-header&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=sticky-header&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=sticky-header&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=sticky-header&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=sticky-header&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=sticky-header)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=sticky-header&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"sticky-section":{"name":"## sticky-section","description":"> 组件类型:UniStickySectionElement \n\n 吸顶布局容器

注意:暂时仅支持作为list-view的子节点, sticky-section不支持css样式!","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.02 | 3.98 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| push-pinned-header | boolean | true | | sticky-section元素重叠时是否继续上推 |\n| padding | array\\ | [0,0,0,0\\] | | 长度为 4 的数组,按 top、right、bottom、left 顺序指定内边距 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/sticky-section/sticky-section.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/sticky-section/sticky-section\n>Template\n```vue\n\r\n\r\n\r\n\r\n\r\n\n```\n>Script\n```uts\n\r\n export default {\r\n data() {\r\n return {\r\n data: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N'],\r\n sectionPadding: [0, 10, 0, 10] as Array,\r\n scrollIntoView: \"\",\r\n scrolling: false\r\n }\r\n },\r\n methods: {\r\n toTop(){\r\n this.scrollIntoView = \"\"\r\n uni.getElementById(\"list-view\")!.scrollTop = 0\r\n },\r\n //用于自动化测试\r\n listViewScrollByY(y : number) {\r\n const listview = this.$refs[\"list-view\"] as UniElement\r\n // listview.scrollBy(0, y)\n listview.scrollTop = y\r\n },\r\n gotoStickyHeader(id : string) {\n // #ifdef APP\r\n this.scrollIntoView = id\n // #endif\n // #ifdef WEB\n console.log(\"web端不支持该功能\")\n // #endif\r\n },\r\n onScroll() {\r\n this.scrolling = true\r\n },\r\n onScrollEnd() {\r\n this.scrolling = false\r\n //滚动后重置scrollIntoView = \"\"\r\n if(this.scrollIntoView != \"\") {\r\n this.scrollIntoView = \"\"\r\n }\n }\r\n }\r\n }\r\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.sticky.sticky-section)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=sticky-section&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=sticky-section&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=sticky-section&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=sticky-section&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=sticky-section&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=sticky-section)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=sticky-section&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"list-view":{"name":"## list-view","description":"> 组件类型:UniListViewElement \n\n 列表组件","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.02 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| direction | string | \"vertical\" | | 滚动方向,可取值 none、horizontal、vertical,默认值vertical。注:iOS 平台仅支持vertical |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| none | | 禁止滚动 |\n@| horizontal | | 横向滚动 |\n@| vertical | | 竖向滚动 |\n| associative-container | string | \"\" | | 关联的滚动容器 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| nested-scroll-view | | 嵌套滚动 |\n| bounces | boolean | true | | 控制是否回弹效果 优先级高于rebound |\n| upper-threshold | number | 50 | | 距顶部/左边多远时(单位px),触发 scrolltoupper 事件 |\n| lower-threshold | number | 50 | | 距底部/右边多远时(单位px),触发 scrolltolower 事件 |\n| scroll-top | number | 0 | | 设置竖向滚动条位置 |\n| scroll-left | number | 0 | | 设置横向滚动条位置 |\n| show-scrollbar | boolean | true | | 控制是否出现滚动条 |\n| scroll-into-view | string([string.IDString](/uts/data-type.md#ide-string)) | - | | 值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素起始位置 |\n| scroll-with-animation | boolean | false | | 是否在设置滚动条位置时使用滚动动画,设置false没有滚动动画 |\n| refresher-enabled | boolean | false | | 开启下拉刷新,暂时不支持scroll-x = true横向刷新 |\n| refresher-threshold | number | 45 | | 设置下拉刷新阈值, 仅 refresher-default-style = 'none' 自定义样式下生效 |\n| refresher-max-drag-distance | number | - | | 设置下拉最大拖拽距离(单位px),默认是下拉刷新控件高度的2.5倍 |\n| refresher-default-style | string | \"black\" | | 设置下拉刷新默认样式,支持设置 black \\| white \\| none, none 表示不使用默认样式 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| black | | 深颜色雪花样式 |\n@| white | | 浅白色雪花样式 |\n@| none | | 不使用默认样式 |\n| refresher-background | string([string.ColorString](/uts/data-type.md#ide-string)) | \"transparent\" | | 设置下拉刷新区域背景颜色,默认透明 |\n| refresher-triggered | boolean | false | | 设置当前下拉刷新状态,true 表示下拉刷新已经被触发,false 表示下拉刷新未被触发 |\n| enable-back-to-top | boolean | false | | iOS点击顶部状态栏滚动条返回顶部,只支持竖向 |\n| custom-nested-scroll | boolean | false | | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| @refresherpulling | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被触发 |\n| @refresherrestore | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被复位 |\n| @refresherabort | (event: [UniRefresherEvent](#unirefresherevent)) => void | - | | 下拉刷新被中止 |\n| @scrolltoupper | (event: [UniScrollToUpperEvent](#uniscrolltoupperevent)) => void | - | | 滚动到顶部/左边,会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [UniScrollToLowerEvent](#uniscrolltolowerevent)) => void | - | | 滚动到底部/右边,会触发 scrolltolower 事件 |\n| @scroll | (event: [UniScrollEvent](#uniscrollevent)) => void | - | | 滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| @scrollend | (event: [UniScrollEvent](#uniscrollevent)) => void | - | | 滚动结束时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| ~~rebound~~ | boolean | true | | 控制是否回弹效果。已废弃,请改用bounces |\n| ~~scroll-y~~ | boolean | true | | 允许纵向滚动,不支持同时设置scroll-x属性为true,同时设置true时scroll-y生效。已废弃,请改用direction |\n| ~~scroll-x~~ | boolean | false | | 允许横向滚动,不支持同时设置scroll-y属性为true,同时设置true时scroll-y生效。已废弃,请改用direction |","event":"\n### 事件\n#### UniRefresherEvent\n\n```mermaid\ngraph LR\n \nUniRefresherEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniRefresherEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniRefresherEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| dy | number | 是 | - | - | - |\n\n\n#### UniScrollToUpperEvent\n\n```mermaid\ngraph LR\n \nUniScrollToUpperEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollToUpperEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollToUpperEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | string | 是 | - | - | 滚动方向 top 或 left |\n\n\n#### UniScrollToLowerEvent\n\n```mermaid\ngraph LR\n \nUniScrollToLowerEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollToLowerEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollToLowerEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| direction | string | 是 | - | - | 滚动方向 bottom 或 right |\n\n\n#### UniScrollEvent\n\n```mermaid\ngraph LR\n \nUniScrollEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniScrollEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniScrollEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| scrollTop | number | 是 | - | - | 竖向滚动的距离 |\n@| scrollLeft | number | 是 | - | - | 横向滚动的距离 |\n@| scrollHeight | number | 是 | - | - | 滚动区域的高度 |\n@| scrollWidth | number | 是 | - | - | 滚动区域的宽度 |\n@| deltaY | number | 是 | - | - | 当次滚动事件竖向滚动量 |\n@| deltaX | number | 是 | - | - | 当次滚动事件横向滚动量 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/list-view/list-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/list-view/list-view\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type ScrollEventTest = {\n type: string;\n target: UniElement | null;\n currentTarget: UniElement | null;\n direction?:string\n }\n import { ItemType } from '@/components/enum-data/enum-data'\n export default {\n data() {\n return {\n refresher_triggered_boolean: false,\n refresher_enabled_boolean: false,\n scroll_with_animation_boolean: false,\n show_scrollbar_boolean: false,\n bounces_boolean: true,\n scroll_y_boolean: true,\n scroll_x_boolean: false,\n scroll_direction: \"vertical\",\n upper_threshold_input: 50,\n lower_threshold_input: 50,\n scroll_top_input: 0,\n scroll_left_input: 0,\n refresher_background_input: \"#FFF\",\n scrollData: [] as Array,\n size_enum: [{ \"value\": 0, \"name\": \"item---0\" }, { \"value\": 3, \"name\": \"item---3\" }] as ItemType[],\n scrollIntoView: \"\",\n refresherrefresh: false,\n refresher_default_style_input: \"black\",\n text: ['继续下拉执行刷新', '释放立即刷新', '刷新中', \"\"],\n state: 3,\n reset: true,\n // 自动化测试\n isScrollTest:'',\n isScrolltolowerTest:'',\n isScrolltoupperTest:'',\n // 在web端scroll事件event参数中detail类型报错,先条件编译处理\n // #ifndef WEB\n scrollDetailTest:null as UniScrollEventDetail|null,\n scrollEndDetailTest:null as UniScrollEventDetail|null,\n // #endif\n }\n },\n onLoad() {\n let lists : Array = []\n for (let i = 0; i < 10; i++) {\n lists.push(\"item---\" + i)\n }\n this.scrollData = lists\n },\n methods: {\n list_view_click() { console.log(\"组件被点击时触发\") },\n list_view_touchstart() { console.log(\"手指触摸动作开始\") },\n list_view_touchmove() { console.log(\"手指触摸后移动\") },\n list_view_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\n list_view_touchend() { console.log(\"手指触摸动作结束\") },\n list_view_tap() { console.log(\"手指触摸后马上离开\") },\n list_view_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\n list_view_refresherpulling(e : RefresherEvent) {\n console.log(\"下拉刷新控件被下拉\")\n if (this.reset) {\n if (e.detail.dy > 45) {\n this.state = 1\n } else {\n this.state = 0\n }\n }\n },\n list_view_refresherrefresh() {\n console.log(\"下拉刷新被触发 \")\n this.refresherrefresh = true\n this.refresher_triggered_boolean = true\n this.state = 2\n this.reset = false;\n setTimeout(() => {\n this.refresher_triggered_boolean = false\n }, 1500)\n },\n list_view_refresherrestore() {\n this.refresherrefresh = false\n this.state = 3\n this.reset = true\n console.log(\"下拉刷新被复位\")\n },\n list_view_refresherabort() { console.log(\"下拉刷新被中止\") },\n list_view_scrolltoupper(e : UniScrollToUpperEvent) {\n console.log(\"滚动到顶部/左边,会触发 scrolltoupper 事件 direction=\" + e.detail.direction)\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget,\n direction:e.detail.direction,\n } as ScrollEventTest,'scrolltoupper')\n },\n list_view_scrolltolower(e : UniScrollToLowerEvent) {\n console.log(\"滚动到底部/右边,会触发 scrolltolower 事件 direction=\" + e.detail.direction)\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget,\n direction:e.detail.direction,\n } as ScrollEventTest,'scrolltolower')\n },\n list_view_scroll(e:UniScrollEvent) {\n console.log(\"滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}\")\n // #ifndef WEB\n this.scrollDetailTest = e.detail\n // #endif\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as ScrollEventTest,'scroll')\n },\n list_view_scrollend(e:UniScrollEvent){\n console.log(\"滚动结束时触发\",e.detail)\n // #ifndef WEB\n this.scrollEndDetailTest = e.detail\n // #endif\n this.checkEventTest({\n type:e.type,\n target:e.target,\n currentTarget:e.currentTarget\n } as ScrollEventTest,'scrollend')\n },\n list_item_click() { console.log(\"list-item组件被点击时触发\") },\n list_item_touchstart() { console.log(\"手指触摸list-item组件动作开始\") },\n list_item_touchmove() { console.log(\"手指触摸list-item组件后移动\") },\n list_item_touchcancel() { console.log(\"手指触摸list-item组件动作被打断,如来电提醒,弹窗\") },\n list_item_touchend() { console.log(\"手指触摸list-item组件动作结束\") },\n list_item_tap() { console.log(\"手指触摸list-item组件后马上离开\") },\n list_item_longpress() { console.log(\"list-item组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\n change_refresher_triggered_boolean(checked : boolean) { this.refresher_triggered_boolean = checked },\n change_refresher_enabled_boolean(checked : boolean) { this.refresher_enabled_boolean = checked },\n change_scroll_with_animation_boolean(checked : boolean) { this.scroll_with_animation_boolean = checked },\n change_show_scrollbar_boolean(checked : boolean) { this.show_scrollbar_boolean = checked },\n change_bounces_boolean(checked : boolean) { this.bounces_boolean = checked },\n change_scroll_y_boolean(checked : boolean) {\n this.scroll_y_boolean = checked\n this.change_scroll_direction()\n },\n change_scroll_x_boolean(checked : boolean) {\n this.scroll_x_boolean = checked\n this.change_scroll_direction()\n },\n change_scroll_direction() {\n if (this.scroll_y_boolean && this.scroll_x_boolean || this.scroll_y_boolean) {\n this.scroll_direction = \"vertical\"\n } else if (!this.scroll_y_boolean && !this.scroll_x_boolean) {\n this.scroll_direction = \"none\"\n } else if (!this.scroll_y_boolean && this.scroll_x_boolean) {\n this.scroll_direction = \"horizontal\"\n }\n },\n confirm_upper_threshold_input(value : number) { this.upper_threshold_input = value },\n confirm_lower_threshold_input(value : number) { this.lower_threshold_input = value },\n confirm_scroll_top_input(value : number) { this.scroll_top_input = value },\n confirm_scroll_left_input(value : number) { this.scroll_left_input = value },\n confirm_refresher_background_input(value : string) { this.refresher_background_input = value },\n item_change_size_enum(index : number) { this.scrollIntoView = \"item---\" + index },\n // 自动化测试专用(由于事件event参数对象中存在循环引用,在ios端JSON.stringify报错,自动化测试无法page.data获取)\n checkEventTest(e:ScrollEventTest, eventName:String){\n const isPass = e.type === eventName && e.target instanceof UniElement && e.currentTarget instanceof UniElement;\n const result = isPass ? `${eventName}:Success` : `${eventName}:Fail`;\n switch (eventName){\n case 'scroll':\n this.isScrollTest = result\n break;\n case 'scrolltolower':\n this.isScrolltolowerTest = result + `-${e.direction}`\n break;\n case 'scrolltoupper':\n this.isScrolltoupperTest = result + `-${e.direction}`\n break;\n default:\n break;\n }\n },\n //自动化测试例专用\n check_scroll_height() : Boolean {\n var listElement = this.$refs[\"listview\"] as UniElement\n console.log(\"check_scroll_height--\" + listElement.scrollHeight)\n if (listElement.scrollHeight > 2000) {\n return true\n }\n return false\n },\n //自动化测试例专用\n check_scroll_width() : Boolean {\n var listElement = this.$refs[\"listview\"] as UniElement\n console.log(\"check_scroll_width\" + listElement.scrollWidth)\n if (listElement.scrollWidth > 2000) {\n return true\n }\n return false\n },\n change_refresher_style_boolean(checked : boolean) {\n if (checked) {\n this.refresher_default_style_input = \"none\"\n } else {\n this.refresher_default_style_input = \"black\"\n }\n }\n }\n }\n\n```\n:::","children":"### 子组件 @children-tags \n - [list-item](list-item.md)\n- [sticky-header](https://uniapp.dcloud.net.cn/uni-app-x/component/sticky.html#sticky-header)\n- [sticky-section](https://uniapp.dcloud.net.cn/uni-app-x/component/sticky.html#sticky-section)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.list-view.list-view)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=list-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=list-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=list-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=list-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=list-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=list-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=list-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"nested-scroll-header":{"name":"## nested-scroll-header","description":"> 组件类型:UniNestedScrollHeaderElement \n\n scroll-view 嵌套模式场景中属于外层 scroll-view 的节点,仅支持作为 \\ 嵌套模式的直接子节点。不支持复数子节点,渲染时会取其第一个子节点来渲染","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.11 | 4.11 |\n","attribute":"","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/nested-scroll-header/nested-scroll-header.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/nested-scroll-header/nested-scroll-header\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n scrollData: [] as Array,\n\t\t\t}\n\t\t},\n onLoad() {\n \tlet lists : Array = []\n \tfor (let i = 0; i < 30; i++) {\n \t\tlists.push(\"item---\" + i)\n \t}\n \tthis.scrollData = lists\n },\n\t\tmethods: {\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.nested-scroll.nested-scroll-header)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=nested-scroll-header&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=nested-scroll-header&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=nested-scroll-header&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=nested-scroll-header&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=nested-scroll-header&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=nested-scroll-header)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=nested-scroll-header&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"nested-scroll-body":{"name":"## nested-scroll-body","description":"> 组件类型:UniNestedScrollHeaderElement \n\n scroll-view 嵌套模式场景中属于嵌套内层 scroll-view 的父节点,仅支持作为 \\ 嵌套模式的直接子节点。不支持复数子节点,渲染时会取其第一个子节点来渲染","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| x | 4.11 | 4.11 |\n","attribute":"","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/nested-scroll-body/nested-scroll-body.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/nested-scroll-body/nested-scroll-body\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n import refreshBox from '../../template/custom-refresher/refresh-box/refresh-box.uvue';\n\texport default {\n components: { refreshBox },\n\t\tdata() {\n\t\t\treturn {\n scrollData: [] as Array,\n scrollTop: 0,\n refresherTriggered: false,\n pullingDistance: 0,\n resetting: false\n\t\t\t}\n\t\t},\n computed: {\n \tstate() : number {\n \t\tif (this.resetting) {\n \t\t\treturn 3;\n \t\t}\n \t\tif (this.refresherTriggered) {\n \t\t\treturn 2\n \t\t}\n \t\tif (this.pullingDistance > 45) {\n \t\t\treturn 1\n \t\t} else {\n \t\t\treturn 0;\n \t\t}\n \t}\n },\n onLoad() {\n \tlet lists : Array = []\n \tfor (let i = 0; i < 30; i++) {\n \t\tlists.push(\"item---\" + i)\n \t}\n \tthis.scrollData = lists\n },\n\t\tmethods: {\n onRefresherpulling(e : RefresherEvent) {\n \tthis.pullingDistance = e.detail.dy;\n },\n onRefresherrefresh() {\n \tthis.refresherTriggered = true\n \tsetTimeout(() => {\n \t\tthis.refresherTriggered = false\n \t\tthis.resetting = true;\n \t}, 1500)\n },\n onRefreshrestore() {\n this.pullingDistance = 0\n \tthis.resetting = false;\n },\n //自动化测试使用\n testBodyScrollBy(y: number) {\n this.scrollTop = y\n }\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.view-container.nested-scroll.nested-scroll-body)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=nested-scroll-body&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=nested-scroll-body&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=nested-scroll-body&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=nested-scroll-body&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=nested-scroll-body&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=nested-scroll-body)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=nested-scroll-body&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"icon":{"name":"## icon","description":"图标","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| type | string | - | | icon的类型,有效值:success, success_no_circle, info, warn, waiting, cancel, download, search, clear |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| success | - | - |\n@| success_no_circle | - | - |\n@| warn | - | - |\n@| waiting | - | - |\n@| cancel | - | - |\n@| download | - | - |\n@| search | - | - |\n@| clear | - | - |\n| size | number | - | | icon的大小,单位px |\n| color | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | icon的颜色,同css的color |","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.icon)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/icon.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=icon&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=icon&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=icon&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=icon&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=icon&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=icon)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=icon&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"text":{"name":"## text","description":"> 组件类型:[UniTextElement](/dom/unitextelement.md) \n\n 文本","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| selectable | boolean | false | | 文本是否可选 |\n| space | string | - | | 显示连续空格 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| ensp | | 中文字符空格一半大小 |\n@| emsp | | 中文字符空格大小 |\n@| nbsp | | 根据字体设置的空格大小 |\n| decode | boolean | false | | 是否解码 (app平台如需解析字符实体,需要配置为 true) |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/text/text.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/text/text\n>Template\n```vue\n\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\r\n export default {\r\n data() {\r\n return {\r\n title: 'text',\r\n texts: [\r\n 'HBuilderX,轻巧、极速,极客编辑器',\r\n 'uni-app x,终极跨平台方案',\r\n 'uniCloud,js serverless云服务',\r\n 'uts,大一统语言',\r\n 'uniMPSdk,让你的App具备小程序能力',\r\n 'uni-admin,开源、现成的全端管理后台',\r\n 'uni-id,开源、全端的账户中心',\r\n 'uni-pay,开源、云端一体、全平台的支付',\r\n 'uni-ai,聚合ai能力',\r\n 'uni-cms,开源、云端一体、全平台的内容管理平台',\r\n 'uni-im,开源、云端一体、全平台的im即时消息',\r\n 'uni统计,开源、完善、全平台的统计报表',\r\n '......'\r\n ] as string[],\r\n text: '',\r\n canAdd: true,\r\n canRemove: false,\r\n extraLine: [] as string[]\r\n }\r\n },\r\n methods: {\r\n add: function () {\r\n this.extraLine.push(this.texts[this.extraLine.length % 12]);\r\n this.text = this.extraLine.join('\\n');\r\n this.canAdd = this.extraLine.length < 12;\r\n this.canRemove = this.extraLine.length > 0;\r\n },\r\n remove: function () {\r\n if (this.extraLine.length > 0) {\r\n this.extraLine.pop();\r\n this.text = this.extraLine.join('\\n');\r\n this.canAdd = this.extraLine.length < 12;\r\n this.canRemove = this.extraLine.length > 0;\r\n }\r\n },\r\n textProps: function () {\r\n uni.navigateTo({\r\n url: '/pages/component/text/text-props'\r\n })\r\n }\r\n }\r\n }\r\n\n```\n:::","children":"### 子组件 @children-tags \n - [text](text.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.text)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/text.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=text&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=text&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=text&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=text&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=text&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=text)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=text&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"rich-text":{"name":"## rich-text","description":"> 组件类型:UniRichTextElement \n\n 富文本。可渲染文字样式、图片、超链接。支持部分HTML标签","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| nodes | array \\| string | - | | 节点列表 \\| HTML String |\n| selectable | boolean | false | | 文本是否可选 |\n| @itemclick | (event: [UniRichTextItemClickEvent](#unirichtextitemclickevent)) => void | - | | 拦截点击事件(只支持 a、img标签),返回用户自定义数据或img标签的src属性或a标签的href属性。event.detail={ ref \\| src \\| href } |","event":"\n### 事件\n#### UniRichTextItemClickEvent\n\n```mermaid\ngraph LR\n \nUniRichTextItemClickEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniRichTextItemClickEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniRichTextItemClickEventDetail** | 是 | - | - | |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| ref | string | 否 | - | - | 自定义数据 |\n@| src | string | 否 | - | - | \\图片链接 |\n@| href | string | 否 | - | - | \\超链接 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/rich-text/rich-text.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/rich-text/rich-text\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n\n\n```\n:::","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.rich-text)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/rich-text.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=rich-text&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=rich-text&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=rich-text&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=rich-text&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=rich-text&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=rich-text)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=rich-text&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"progress":{"name":"## progress","description":"> 组件类型:UniProgressElement \n\n 进度条","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| duration | number | 30 | | 进度增加1%所需毫秒数 |\n| percent | number | 0 | | 百分比0~100 |\n| show-info | boolean | false | | 在进度条右侧显示百分比 |\n| border-radius | number | 0 | | 圆角大小 |\n| font-size | number | 16 | | 右侧百分比字体大小 |\n| stroke-width | number | 6 | | 进度条线的宽度,单位px |\n| activeColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#09BB07\" | | 已选择的进度条的颜色 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#EBEBEB\" | | 未选择的进度条的颜色 |\n| active | boolean | false | | 进度条从左往右的动画 |\n| active-mode | string | \"backwards\" | | backwards: 动画从头播;forwards:动画从上次结束点接着播 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| backwards | | 动画从头播 |\n@| forwards | | 动画从上次结束点接着播 |\n| @activeend | (event: [UniProgressActiveendEvent](#uniprogressactiveendevent)) => void | - | | 动画完成事件 |","event":"\n### 事件\n#### UniProgressActiveendEvent\n\n```mermaid\ngraph LR\n \nUniProgressActiveendEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/progress/progress.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/progress/progress\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\r\n import { state, setEventCallbackNum } from '@/store/index.uts'\r\n import { ItemType } from '@/components/enum-data/enum-data'\r\n export default {\r\n data() {\r\n return {\r\n title: 'progress',\r\n pgList: [0, 0, 0, 0] as number[],\r\n curPercent: 0,\r\n showInfo: true,\r\n borderRadius: 0,\r\n fontSize: 16,\r\n strokeWidth: 3,\r\n backgroundColor: '#EBEBEB',\r\n\r\n // 组件属性 autotest\r\n active_boolean: false,\r\n show_info_boolean: false,\r\n duration_input: 30,\r\n percent_input: 0,\r\n stroke_width_input: 6,\r\n activeColor_input: \"#09BB07\",\r\n backgroundColor_input: \"#EBEBEB\",\r\n active_mode_enum: [{ \"value\": 0, \"name\": \"backwards\" }, { \"value\": 1, \"name\": \"forwards\" }] as ItemType[],\r\n active_mode_enum_current: 0\r\n }\r\n },\r\n methods: {\r\n // 自动化测试\r\n getEventCallbackNum() : number {\r\n return state.eventCallbackNum\r\n },\r\n // 自动化测试\r\n setEventCallbackNum(num : number) {\r\n setEventCallbackNum(num)\r\n },\r\n\r\n setProgress() {\r\n this.pgList = [20, 40, 60, 80] as number[]\r\n },\r\n clearProgress() {\r\n this.pgList = [0, 0, 0, 0] as number[]\r\n },\r\n activeend(e : UniProgressActiveendEvent) {\r\n // 自动化测试\r\n if ((e.target?.tagName ?? '').includes('PROGRESS')) {\r\n this.setEventCallbackNum(state.eventCallbackNum + 1)\r\n }\r\n if (e.type === 'activeend') {\r\n this.setEventCallbackNum(state.eventCallbackNum + 2)\r\n }\r\n this.curPercent = e.detail.curPercent\r\n },\r\n progress_touchstart() { console.log(\"手指触摸动作开始\") },\r\n progress_touchmove() { console.log(\"手指触摸后移动\") },\r\n progress_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\r\n progress_touchend() { console.log(\"手指触摸动作结束\") },\r\n progress_tap() { console.log(\"手指触摸后马上离开\") },\r\n change_active_boolean(checked : boolean) { this.active_boolean = checked },\r\n change_show_info_boolean(checked : boolean) { this.show_info_boolean = checked },\r\n confirm_duration_input(value : number) { this.duration_input = value },\r\n confirm_percent_input(value : number) { this.percent_input = value },\r\n confirm_stroke_width_input(value : number) { this.stroke_width_input = value },\r\n confirm_activeColor_input(value : string) { this.activeColor_input = value },\r\n confirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n radio_change_active_mode_enum(checked : number) { this.active_mode_enum_current = checked }\r\n }\r\n }\r\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.progress)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/progress.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=progress&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=progress&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=progress&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=progress&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=progress&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=progress)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=progress&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"button":{"name":"## button","description":"> 组件类型:UniButtonElement \n\n 按钮","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | false | | 是否禁用 |\n| hover-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"button-hover\" | | 指定按下去的样式类。当 hover-class=\"none\" 时,没有点击态效果 |\n| hover-start-time | number | 20 | | 按住后多久出现点击态,单位毫秒 |\n| hover-stay-time | number | 70 | | 手指松开后点击态保留时间,单位毫秒 |\n| size | string | \"default\" | | 按钮的大小 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| default | | 默认大小 |\n@| mini | | 小尺寸 |\n| type | string | \"default\" | | 按钮的样式类型 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| default | | 白色 |\n@| primary | | 蓝色 |\n@| warn | | 红色 |\n| plain | boolean | false | | 按钮是否镂空,背景色透明 |\n| loading | boolean | - | | 名称前是否带 loading 图标 |\n| form-type | string | - | | 用于 form 组件,点击分别会触发 form 组件的 submit/reset 事件 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| submit | | 提交表单 |\n@| reset | | 重置表单 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/button/button.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/button/button\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\r\n import { ItemType } from '@/components/enum-data/enum-data'\r\n export default {\r\n data() {\r\n return {\r\n plain_boolean: false,\r\n disabled_boolean: false,\r\n default_style: false,\r\n size_enum: [{ \"value\": 0, \"name\": \"default\" }, { \"value\": 1, \"name\": \"mini\" }] as ItemType[],\r\n size_enum_current: 0,\r\n type_enum: [{ \"value\": 0, \"name\": \"default\" }, { \"value\": 1, \"name\": \"primary\" }, { \"value\": 2, \"name\": \"warn\" }] as ItemType[],\r\n type_enum_current: 0,\r\n count: 0,\r\n text: ''\r\n }\r\n },\n onReady() {\n this.text = 'uni-app-x'\n },\r\n methods: {\r\n button_click() {\r\n console.log(\"组件被点击时触发\")\r\n this.count++\r\n },\r\n button_touchstart() { console.log(\"手指触摸动作开始\") },\r\n button_touchmove() { console.log(\"手指触摸后移动\") },\r\n button_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\r\n button_touchend() { console.log(\"手指触摸动作结束\") },\r\n button_tap() { console.log(\"手指触摸后马上离开\") },\r\n button_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\r\n change_plain_boolean(checked : boolean) { this.plain_boolean = checked },\r\n change_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\r\n change_default_style(checked : boolean) { this.default_style = checked },\r\n radio_change_size_enum(checked : number) { this.size_enum_current = checked },\r\n radio_change_type_enum(checked : number) { this.type_enum_current = checked },\r\n confirm_text_input(value : string) { this.text = value },\r\n navigateToChild() {\r\n uni.navigateTo({\r\n url: 'buttonstatus',\r\n })\r\n },\r\n //用于自动化测试\r\n checkUniButtonElement() : boolean {\r\n const button = uni.getElementById(\"testButton\")\r\n if (button != null && button instanceof UniButtonElement) {\r\n return true\r\n }\r\n return false\r\n }\r\n }\r\n }\r\n\n```\n:::","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.button)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/button.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=button&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=button&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=button&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=button&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=button&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=button)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=button&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"checkbox":{"name":"## checkbox","description":"> 组件类型:UniCheckboxElement \n\n 多选项。在1组check-group中可选择多个","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | false | | 是否禁用 |\n| value | string | - | | checkbox 标识,选中时触发 checkbox-group 的 change 事件,并携带 checkbox 的 value |\n| checked | boolean | false | | 当前是否选中,可用来设置默认选中 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | checkbox默认的背景颜色 |\n| borderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#d1d1d1\" | | checkbox默认的边框颜色 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | checkbox选中时的背景颜色 |\n| activeBorderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#d1d1d1\" | | checkbox选中时的边框颜色 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | checkbox的图标颜色,优先级大于color属性 |\n| ~~iconColor~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | checkbox的图标颜色,优先级大于color属性 (使用foreColor替代) |\n| ~~color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | checkbox的颜色 (使用foreColor替代) |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/checkbox/checkbox.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/checkbox/checkbox\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type ItemType = {\n value : string\n name : string\n checked : boolean\n }\n export default {\n data() {\n return {\n items: [\n {\n value: 'CHN',\n name: '中国',\n checked: true,\n },\n {\n value: 'USA',\n name: '美国',\n checked: false,\n },\n {\n value: 'BRA',\n name: '巴西',\n checked: false,\n },\n {\n value: 'JPN',\n name: '日本',\n checked: false,\n },\n {\n value: 'ENG',\n name: '英国',\n checked: false,\n },\n {\n value: 'FRA',\n name: '法国',\n checked: false,\n },\n ] as ItemType[],\n testEvent: false,\n text: '未选中',\n wrapText: 'uni-app x,终极跨平台方案\\nuts,大一统语言',\n value: [] as string[],\n disabled: true,\n checked: true,\n color: '#007aff',\n iconColor: '#211cfe',\n foreColor: '#ff0000',\n // 组件属性 autotest\n checked_boolean: false,\n disabled_boolean: false,\n color_input: \"#007aff\",\n backgroundColor_input: \"#ffffff\",\n borderColor_input: \"#d1d1d1\",\n activeBackgroundColor_input: \"#ffffff\",\n activeBorderColor_input: \"#d1d1d1\",\n iconColor_input: \"#007aff\",\n foreColor_input: '#ff0000'\n }\n },\n methods: {\n\n checkboxChange: function (e : UniCheckboxGroupChangeEvent) {\n // 自动化测试\n if ((e.target?.tagName ?? '') == 'CHECKBOX-GROUP' && e.type === 'change') {\n this.testEvent = true\n }\n\n const selectedNames : string[] = []\n this.items.forEach((item) => {\n if (e.detail.value.includes(item.value)) {\n selectedNames.push(item.name)\n }\n })\n uni.showToast({\n icon: 'none',\n title: '当前选中:' + selectedNames.join(','),\n })\n },\n testChange: function (e : UniCheckboxGroupChangeEvent) {\n this.value = e.detail.value\n },\n checkbox_click() { console.log(\"组件被点击时触发\") },\n checkbox_touchstart() { console.log(\"手指触摸动作开始\") },\n checkbox_touchmove() { console.log(\"手指触摸后移动\") },\n checkbox_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\n checkbox_touchend() { console.log(\"手指触摸动作结束\") },\n checkbox_tap() { console.log(\"手指触摸后马上离开\") },\n checkbox_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\n change_checked_boolean(checked : boolean) { this.checked_boolean = checked },\n change_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\n confirm_color_input(value : string) { this.color_input = value },\n confirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\n confirm_borderColor_input(value : string) { this.borderColor_input = value },\n confirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\n confirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\n confirm_iconColor_input(value : string) { this.iconColor_input = value },\n confirm_foreColor_input(value : string) { this.foreColor_input = value }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.checkbox.checkbox)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/checkbox.html#checkbox)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=checkbox&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=checkbox&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=checkbox&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=checkbox&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=checkbox&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=checkbox)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=checkbox&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"checkbox-group":{"name":"## checkbox-group","description":"> 组件类型:UniCheckboxGroupElement \n\n 多选框组","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| @change | (event: [UniCheckboxGroupChangeEvent](#unicheckboxgroupchangeevent)) => void | - | | checkbox-group中选中项发生改变是触发 change 事件,detail = {value:\\[选中的checkbox的value的数组] |","event":"\n### 事件\n#### UniCheckboxGroupChangeEvent\n\n```mermaid\ngraph LR\n \nUniCheckboxGroupChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"","children":"### 子组件 @children-tags \n - [checkbox](checkbox.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.checkbox.checkbox-group)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/checkbox.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=checkbox-group&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=checkbox-group&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=checkbox-group&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=checkbox-group&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=checkbox-group&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=checkbox-group)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=checkbox-group&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"form":{"name":"## form","description":"> 组件类型:UniFormElement \n\n 表单","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.97 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | - | | 是否禁用 |\n| @submit | (event: [UniFormSubmitEvent](#uniformsubmitevent)) => void | - | | 携带 form 中的数据触发 submit 事件,event.detail = {value : {'name': 'value'}} |\n| @reset | (event: [UniFormResetEvent](#uniformresetevent)) => void | - | | 表单重置时会触发 reset 事件 |","event":"\n### 事件\n#### UniFormSubmitEvent\n\n```mermaid\ngraph LR\n \nUniFormSubmitEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```\n#### UniFormResetEvent\n\n```mermaid\ngraph LR\n \nUniFormResetEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/form/form.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/form/form\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n nickname: '',\n gender: '0',\n age: 18,\n loves: ['0'],\n switch: true,\n comment:'',\n formData: {} as UTSJSONObject,\n // 仅测试\n testVerifySubmit: false,\n testVerifyReset: false,\n }\n },\n computed: {\n formDataText() : string {\n return JSON.stringify(this.formData)\n }\n },\n methods: {\n onFormSubmit: function (e : UniFormSubmitEvent) {\n console.log(e.target?.tagName ?? '123');\n console.log(e.type);\n this.formData = e.detail.value\n\n // 仅测试\n this.testVerifySubmit = (e.type == 'submit' && (e.target?.tagName ?? '') == \"FORM\")\n },\n onFormReset: function (e : UniFormResetEvent) {\n this.formData = {}\n\n // 仅测试\n this.testVerifyReset = (e.type == 'reset' && (e.target?.tagName ?? '') == \"FORM\")\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.form)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/form.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=form&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=form&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=form&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=form&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=form&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=form)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=form&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"input":{"name":"## input","description":"> 组件类型:[UniInputElement](/dom/uniinputelement.md) \n\n 输入框","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| disabled | boolean | false | | 是否禁用 |\n| value | string | \"\" | | 输入框的初始内容 |\n| type | text \\| number \\| digit \\| tel | \"text\" | | input的类型 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| text | | 文本输入键盘 |\n@| number | | 数字输入键盘 |\n@| digit | | 带小数点数字输入键盘 |\n@| tel | | 电话输入键盘 |\n| password | boolean | false | | 是否是密码类型 |\n| placeholder | string | \"\" | | 输入框为空时占位符 |\n| placeholder-style | string | \"\" | | 指定 placeholder 的样式 |\n| placeholder-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"\" | | 指定 placeholder 的样式类,目前仅支持color,font-size和font-weight |\n| maxlength | number | \"不限制长度\" | | 最大输入长度,0和正数为合法值,非法值的时候不限制最大长度 |\n| cursor-spacing | number | 0 | | 指定光标与键盘的距离,单位 px 。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| cursor-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | 指定光标颜色 |\n| auto-focus | boolean | false | | 自动获取焦点,与`focus`属性对比,此属性只会首次生效。 |\n| focus | boolean | false | | 获取焦点 |\n| confirm-type | send \\| search \\| next \\| go \\| done | \"done\" | | 设置键盘右下角按钮的文字,仅在 type为text 时生效。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| send | | 发送 |\n@| search | | 搜索 |\n@| next | | 下一个 |\n@| go | | 前往 |\n@| done | | 完成 |\n| confirm-hold | boolean | false | | 点击键盘右下角按钮时是否保持键盘不收起 |\n| cursor | number | 0 | | 指定focus时的光标位置 |\n| selection-start | number | -1 | | 光标起始位置,自动聚集时有效,需与selection-end搭配使用 |\n| selection-end | number | -1 | | 光标结束位置,自动聚集时有效,需与selection-satrt搭配使用 |\n| adjust-position | boolean | true | | 键盘弹起时,是否自动上推页面 |\n| hold-keyboard | boolean | false | | focus时,点击页面的时候不收起键盘 |\n| inputmode | none \\| text \\| decimal \\| numeric \\| tel \\| search \\| email \\| url | \"text\" | | 是一个枚举属性,它提供了用户在编辑元素或其内容时可能输入的数据类型的提示。在符合条件的高版本webview里,uni-app的 web 和 app-vue 平台中可使用本属性。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| none | | 无虚拟键盘。在应用程序或者站点需要实现自己的键盘输入控件时很有用。 |\n@| text | | 使用用户本地区域设置的标准文本输入键盘。 |\n@| decimal | | 小数输入键盘,包含数字和分隔符(通常是“ . ”或者“ , ”),设备可能也可能不显示减号键。 |\n@| numeric | | 数字输入键盘,所需要的就是 0 到 9 的数字,设备可能也可能不显示减号键。 |\n@| tel | | 电话输入键盘,包含 0 到 9 的数字、星号(*)和井号(#)键。表单输入里面的电话输入通常应该使用 \\ 。 |\n@| search | | 为搜索输入优化的虚拟键盘,比如,返回键可能被重新标记为“搜索”,也可能还有其他的优化。 |\n@| email | | 为邮件地址输入优化的虚拟键盘,通常包含\"@\"符号和其他优化。表单里面的邮件地址输入应该使用 \\ 。 |\n@| url | | 为网址输入优化的虚拟键盘,比如,“/”键会更加明显、历史记录访问等。表单里面的网址输入通常应该使用 \\ 。 |\n| @input | (event: [UniInputEvent](#uniinputevent)) => void | - | | 当键盘输入时,触发input事件,event.detail = {value, cursor},处理函数可以直接 return 一个字符串,将替换输入框的内容。 |\n| @focus | (event: [UniInputFocusEvent](#uniinputfocusevent)) => void | - | | 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度 |\n| @blur | (event: [UniInputBlurEvent](#uniinputblurevent)) => void | - | | 输入框失去焦点时触发,event.detail = {value: value} |\n| @keyboardheightchange | (event: [UniInputKeyboardHeightChangeEvent](#uniinputkeyboardheightchangeevent)) => void | - | | 键盘高度发生变化的时候触发此事件,event.detail = {height: height, duration: duration} |\n| @confirm | (event: [UniInputConfirmEvent](#uniinputconfirmevent)) => void | - | | 点击完成按钮时触发,event.detail = {value: value} |","event":"\n### 事件\n#### UniInputEvent\n\n```mermaid\ngraph LR\n \nUniInputEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 光标的位置 |\n@| keyCode | number | 是 | - | - | 输入字符的Unicode值 |\n\n\n#### UniInputFocusEvent\n\n```mermaid\ngraph LR\n \nUniInputFocusEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputFocusEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputFocusEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | | 键盘高度 |\n@| value | string | 是 | - | - | 输入框内容 |\n\n\n#### UniInputBlurEvent\n\n```mermaid\ngraph LR\n \nUniInputBlurEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputBlurEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputBlurEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 选择区域的起始位置 |\n\n\n#### UniInputKeyboardHeightChangeEvent\n\n```mermaid\ngraph LR\n \nUniInputKeyboardHeightChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputKeyboardHeightChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputKeyboardHeightChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | - | 键盘高度 |\n@| duration | number | 是 | - | - | 持续时间 |\n\n\n#### UniInputConfirmEvent\n\n```mermaid\ngraph LR\n \nUniInputConfirmEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputConfirmEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputConfirmEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/input/input.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/input/input\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'input',\n showClearIcon: false,\n inputClearValue: '',\n showPassword: true,\n cursor: -1,\n cursor_color: \"#3393E2\",\n selectionStart: -1,\n selectionEnd: -1,\n inputEventDetail: '',\n focusAndBlurEventDetail: '',\n confirmEventDetail: '',\n keyboardHeightChangeEventDetail: '',\n focus: true,\n inputPassword: true,\n inputTypeTel: \"tel\",\n inputPlaceHolderStyle: \"color:red\",\n inputPlaceHolderClass: \"uni-input-placeholder-class\" as string.ClassString ,\n inputMaxLengthValue: \"\",\n onMaxLengthInputValue: \"\",\n inputMaxLengthFocus: false,\n inputPasswordValue: \"cipher\",\n inputFocusKeyBoardChangeValue: true,\n holdKeyboard: false,\n keyboardHeight: 0,\n focusedForKeyboardHeightChangeTest: false,\n demoValue: '123',\n adjustPosition: false\n }\n },\n methods: {\n inputFocusKeyBoardChange(e : UniInputKeyboardHeightChangeEvent) {\n this.inputFocusKeyBoardChangeValue = e.detail.height > 50\n },\n onMaxLengthInput(event : UniInputEvent) {\n this.onMaxLengthInputValue = event.detail.value\n },\n setCursor: function (cursor : number) {\n (this.$refs['input'] as UniInputElement).focus();\n this.cursor = cursor;\n },\n onCursorBlurChange(){\n this.cursor = 0\n },\n setSelection: function (selectionStart : number, selectionEnd : number) {\n (this.$refs['input2'] as UniInputElement).focus();\n this.selectionStart = selectionStart;\n this.selectionEnd = selectionEnd;\n },\n onSelectionBlurChange(){\n this.selectionEnd = 0;\n },\n clearInput: function (event : UniInputEvent) {\n this.inputClearValue = event.detail.value\n if (event.detail.value.length > 0) {\n this.showClearIcon = true\n } else {\n this.showClearIcon = false\n }\n },\n clearIcon: function () {\n this.inputClearValue = ''\n this.showClearIcon = false\n },\n changePassword: function () {\n this.showPassword = !this.showPassword\n },\n onInput: function (event : UniInputEvent) {\n console.log(\"键盘输入\", JSON.stringify(event.detail));\n this.inputEventDetail = JSON.stringify(event.detail)\n },\n onFocus: function (event : UniInputFocusEvent) {\n console.log(\"输入框聚焦\", JSON.stringify(event.detail));\n this.focusAndBlurEventDetail = JSON.stringify(event.detail);\n },\n onBlur: function (event : UniInputBlurEvent) {\n console.log(\"输入框失去焦点\", JSON.stringify(event.detail));\n this.focusAndBlurEventDetail = JSON.stringify(event.detail);\n },\n onConfirm: function (event : UniInputConfirmEvent) {\n console.log(\"点击完成按钮\", JSON.stringify(event.detail));\n this.confirmEventDetail = JSON.stringify(event.detail);\n },\n onKeyborardHeightChange: function (event : UniInputKeyboardHeightChangeEvent) {\n console.log(\"键盘高度发生变化\", JSON.stringify(event.detail));\n this.keyboardHeightChangeEventDetail = JSON.stringify(event.detail);\n this.keyboardHeight = event.detail.height;\n },\n test_check_input_value() : number {\n return this.onMaxLengthInputValue.length\n },\n changeCursorColor(event : UniSwitchChangeEvent) {\n const checked = event.detail.value;\n if (checked) {\n this.cursor_color = \"red\"\n } else {\n this.cursor_color = \"#3393E2\"\n }\n const input = uni.getElementById(\"uni-input-cursor-color\")\n input?.focus()\n },\n changeHoldKeyboard(event : UniSwitchChangeEvent) {\n const checked = event.detail.value;\n this.holdKeyboard = checked\n },\n changeAdjustPosition(event : UniSwitchChangeEvent){\n const checked = event.detail.value;\n this.adjustPosition = checked\n }\n }\n }\n\n```\n:::","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.input)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/input.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=input&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=input&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=input&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=input&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=input&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=input)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=input&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"editor":{"name":"## editor","description":"富文本编辑器,可以对图片、文字进行编辑。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| read-only | boolean | - | | 设置编辑器为只读。 |\n| placeholder | string | - | | 提示信息。 |\n| show-img-size | boolean | - | | 点击图片时显示图片大小控件。 |\n| show-img-toolbar | boolean | - | | 点击图片时显示工具栏控件。 |\n| show-img-resize | string | - | | 点击图片时显示修改尺寸控件。 |\n| @ready | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器初始化完成时触发 |\n| @focus | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器聚焦时触发,event.detail = {html, text, delta} |\n| @blur | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器失去焦点时触发,detail = {html, text, delta} |\n| @input | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器内容改变时触发,detail = {html, text, delta} |\n| @statuschange | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 通过 Context 方法改变编辑器内样式时触发,返回选区已设置的样式 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/editor/editor.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/editor/editor\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type Context = {\n \tid?: string;\n \tpageId?: number;\n }\n\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\treadOnly: false,\n\t\t\t\tformats: {},\n editorCtx:{} as Context,\n // 自动化测试\n autoTest:false,\n undoTest:false,\n redoTest:false,\n removeFormatTest:false\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tuni.loadFontFace({\n\t\t\t\tfamily: 'Pacifico',\n\t\t\t\tsource: 'url(\"/static/font/Pacifico-Regular.ttf\")',\n\t\t\t\tsuccess() {\n\t\t\t\t\tconsole.log('success load font')\n\t\t\t\t},\n\t\t\t\tfail() {\n\t\t\t\t\tconsole.log('fail load font load')\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\t\tmethods: {\n\t\t\treadOnlyChange() {\n\t\t\t\tthis.readOnly = !this.readOnly\n\t\t\t},\n\t\t\tonEditorReady() {\n\t\t\t\tuni.createSelectorQuery().select('#editor').context((res) => {\n\t\t\t\t\tthis.editorCtx = res.context\n\t\t\t\t}).exec()\n\t\t\t},\n // 自动化测试专用\n setContents(options) {\n \tthis.editorCtx.setContents({\n delta: {\n ops:options\n },\n success: (res) => {\n \tconsole.log('setContents-success', res)\n },\n fail: (err) => {\n \tconsole.log(err)\n }\n \t})\n },\n getCon() {\n \tthis.editorCtx.getContents({\n \t\tsuccess: (res) => {\n \t\t\tconsole.log('文本详情:', res)\n \t\t},\n \t\tfail: (err) => {\n \t\t\tconsole.log(err)\n \t\t}\n \t})\n },\n\t\t\tundo() {\n\t\t\t\tthis.editorCtx.undo({\n \t\tsuccess: (res) => {\n this.undoTest = true\n \t\t},\n \t\tfail: (err) => {\n this.undoTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tredo() {\n\t\t\t\tthis.editorCtx.redo({\n \t\tsuccess: (res) => {\n this.redoTest = true\n \t\t},\n \t\tfail: (err) => {\n this.redoTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tformat(e) {\n\t\t\t\tlet {name,value} = e.target.dataset\n\t\t\t\tif (!name) return\n\t\t\t\t// console.log('format', name, value)\n\t\t\t\tthis.editorCtx.format(name, value)\n\t\t\t},\n\t\t\tonStatusChange(e) {\n\t\t\t\tconst formats = e.detail\n\t\t\t\tthis.formats = formats\n\t\t\t},\n\t\t\tinsertDivider() {\n\t\t\t\tthis.editorCtx.insertDivider({\n\t\t\t\t\tsuccess: function() {\n\t\t\t\t\t\tconsole.log('insert divider success')\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t},\n clear() {\n this.editorCtx.clear({\n success: function(res) {\n console.log(\"clear success\")\n }\n })\n },\n\t\t\tclearShowModal() {\n uni.showModal({\n \ttitle: '清空编辑器',\n \tcontent: '确定清空编辑器全部内容?',\n \tsuccess: res => {\n \t\tif (res.confirm) {\n \t\t\tthis.clear()\n \t\t}\n \t}\n })\n\t\t\t},\n\t\t\tremoveFormat() {\n\t\t\t\tthis.editorCtx.removeFormat({\n \t\tsuccess: (res) => {\n \t\t\tconsole.log('removeFormat-success', res)\n this.removeFormatTest = true\n \t\t},\n \t\tfail: (err) => {\n this.removeFormatTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tinsertDate() {\n\t\t\t\tconst date = new Date()\n\t\t\t\tconst formatDate = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`\n\t\t\t\tthis.editorCtx.insertText({\n\t\t\t\t\ttext: formatDate\n\t\t\t\t})\n\t\t\t},\n insertImage(image){\n this.editorCtx.insertImage({\n src:image,\n alt: '图像',\n success: function() {\n console.log('insert image success')\n }\n })\n },\n\t\t\tchooseInsertImage() {\n uni.chooseImage({\n \tcount: 1,\n \tsuccess: (res) => {\n \t\tthis.insertImage(res.tempFilePaths[0])\n \t}\n })\n\t\t\t}\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.editor)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/editor.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=editor&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=editor&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=editor&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=editor&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=editor&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=editor)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=editor&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"label":{"name":"## label","description":"用来改进表单组件的可用性,使用for属性找到对应的id,或者将控件放在该标签下,当点击时,就会触发对应的控件","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | - | | 是否禁用 |\n| for | string | - | | 绑定控件的 id |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/label/label.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/label/label\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'label',\n checkboxItems: [{\n name: 'USA',\n value: '美国'\n },\n {\n name: 'CHN',\n value: '中国',\n checked: 'true'\n }\n ],\n radioItems: [{\n name: 'USA',\n value: '美国'\n },\n {\n name: 'CHN',\n value: '中国',\n checked: 'true'\n }\n ],\n hidden: false,\n checkboxValue: [] as string[],\n radioValue:''\n }\n },\n methods: {\n checkboxChange: function (e : UniCheckboxGroupChangeEvent) {\n console.log(e.detail.value)\n this.checkboxValue = e.detail.value\n },\n radioChange: function (e : UniRadioGroupChangeEvent) {\n console.log(e.detail.value)\n this.radioValue = e.detail.value\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.label)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/label.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=label&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=label&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=label&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=label&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=label&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=label)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=label&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker":{"name":"## picker","description":"从底部弹起的滚动选择器,现支持五种选择器,通过mode来区分,分别是普通选择器,多列选择器,时间选择器,日期选择器,省市区选择器,默认是普通选择器。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | - | | 是否禁用 |\n| mode | string | - | | 选择器类型 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| selector | - | 普通选择器 |\n@| multiSelector | - | 多列选择器 |\n@| time | - | 时间选择器 |\n@| date | - | 日期选择器 |\n@| region | - | 省市选择器 |\n| range | array | - | | mode为 selector 或 multiSelector 时,range 有效 |\n| range-key | string | - | | 当 range 是一个 Object Array 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 |\n| value | string | - | | mode为select或multiSelector时:value 的值表示选择了 range 中的第几个(下标从 0 开始);mode为time时:表示选中的时间,格式为\"hh:mm\";mode为date时:表示选中的日期,格式为\"YYYY-MM-DD\";mode为region时:
\t\t表示选中的省市区,默认选中每一列的第一个值。 |\n| start | string | - | | mode为time:表示有效时间范围的开始,字符串格式为\"hh:mm\";mode为date:表示有效日期范围的开始,字符串格式为\"YYYY-MM-DD\" |\n| end | string | - | | mode为time:表示有效时间范围的结束,字符串格式为\"hh:mm\";mode为date:表示有效日期范围的结束,字符串格式为\"YYYY-MM-DD\" |\n| fields | string | - | | 有效值 year,month,day,表示选择器的粒度 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| year | - | 选择器粒度为年 |\n@| month | - | 选择器粒度为月份 |\n@| day | - | 选择器粒度为天 |\n| custom-item | string | - | | 可为每一列的顶部添加一个自定义的项 |\n| @change | (event: [UniEvent](/component/common.md#unievent)) => void | - | | value 改变时触发 change 事件,event.detail = {value: value} |\n| @columnchange | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 某一列的值改变时触发 columnchange 事件,event.detail = {column: column, value: value},column 的值表示改变了第几列(下标从0开始),value 的值表示变更值的下标 |\n| @cancel | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 取消选择时触发 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/picker/picker.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/picker/picker\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n\n\tfunction getDate(type?:string):string {\n\t\tconst date = new Date();\n\n\t\tlet year:string | number = date.getFullYear();\n\t\tlet month:string | number = date.getMonth() + 1;\n\t\tlet day:string | number = date.getDate();\n\n\t\tif (type === 'start') {\n\t\t\tyear = year - 10;\n\t\t} else if (type === 'end') {\n\t\t\tyear = year + 10;\n\t\t}\n\t\tmonth = month > 9 ? month : '0' + month;;\n\t\tday = day > 9 ? day : '0' + day;\n\n\t\treturn `${year}-${month}-${day}`;\n\t}\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\ttitle: 'picker',\n\t\t\t\tarray: [{name:'中国'},{name: '美国'}, {name:'巴西'}, {name:'日本'}],\n\t\t\t\tindex: 0,\n\t\t\t\tmultiArray: [\n\t\t\t\t\t['亚洲', '欧洲'],\n\t\t\t\t\t['中国', '日本'],\n\t\t\t\t\t['北京', '上海', '广州']\n\t\t\t\t],\n\t\t\t\tmultiIndex: [0, 0, 0],\n date:getDate(),\n\t\t\t\tstartDate:getDate('start'),\n\t\t\t\tendDate:getDate('end'),\n\t\t\t\ttime: '12:01'\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tbindPickerChange: function(e) {\n\t\t\t\tconsole.log('picker发送选择改变,携带值为:' + e.detail.value)\n\t\t\t\tthis.index = e.detail.value\n\t\t\t},\n\t\t\tbindMultiPickerColumnChange: function(e) {\n\t\t\t\tconsole.log('修改的列为:' + e.detail.column + ',值为:' + e.detail.value)\n\t\t\t\tthis.multiIndex[e.detail.column] = e.detail.value\n\t\t\t\tswitch (e.detail.column) {\n\t\t\t\t\tcase 0: //拖动第1列\n\t\t\t\t\t\tswitch (this.multiIndex[0]) {\n\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\tthis.multiArray[1] = ['中国', '日本']\n\t\t\t\t\t\t\t\tthis.multiArray[2] = ['北京', '上海', '广州']\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\tthis.multiArray[1] = ['英国', '法国']\n\t\t\t\t\t\t\t\tthis.multiArray[2] = ['伦敦', '曼彻斯特']\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.multiIndex.splice(1, 1, 0)\n\t\t\t\t\t\tthis.multiIndex.splice(2, 1, 0)\n\t\t\t\t\t\tbreak\n\t\t\t\t\tcase 1: //拖动第2列\n\t\t\t\t\t\tswitch (this.multiIndex[0]) { //判断第一列是什么\n\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\tswitch (this.multiIndex[1]) {\n\t\t\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['北京', '上海', '广州']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['东京','北海道']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\tswitch (this.multiIndex[1]) {\n\t\t\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['伦敦', '曼彻斯特']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['巴黎', '马赛']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.multiIndex.splice(2, 1, 0)\n\t\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t\tthis.$forceUpdate()\n\t\t\t},\n\t\t\tbindDateChange: function(e) {\n\t\t\t\tthis.date = e.detail.value\n\t\t\t},\n\t\t\tbindTimeChange: function(e) {\n\t\t\t\tthis.time = e.detail.value\n\t\t\t}\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker-view-column":{"name":"## picker-view-column","description":"仅可放置于 picker-view 中,其子节点未继承 picker-view 的选中框的高度,需要自己设置高度并居中","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker-view.picker-view-column)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker-view.html#picker-view-column)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker-view-column&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker-view-column&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker-view-column&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker-view-column&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker-view-column&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker-view-column)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker-view-column&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker-view":{"name":"## picker-view","description":"> 组件类型:UniPickerViewElement \n\n 嵌入页面的滚动选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| value | array\\ | - | | picker-view-column 选择的第几项 |\n| indicator-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置选择器中间选中框的样式 |\n| indicator-class | string([string.ClassString](/uts/data-type.md#ide-string)) | - | | 设置选择器中间选中框的类名 |\n| mask-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层的样式 |\n| mask-top-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层上半部分的样式 |\n| mask-bottom-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层下半部分的样式 |\n| mask-class | string([string.ClassString](/uts/data-type.md#ide-string)) | - | | 设置蒙层的类名 |\n| @change | (event: [UniPickerViewChangeEvent](#unipickerviewchangeevent)) => void | - | | 当滚动选择,value 改变时触发 change 事件,event.detail = {value: value};value为数组,表示 picker-view 内的 picker-view-column 当前选择的是第几项(下标从 0
\t\t开始) |","event":"\n### 事件\n#### UniPickerViewChangeEvent\n\n```mermaid\ngraph LR\n \nUniPickerViewChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/picker-view/picker-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/picker-view/picker-view\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\n import { state, setEventCallbackNum } from '@/store/index.uts'\r\n export default {\r\n data() {\r\n const date = new Date()\r\n const _years : number[] = []\r\n const _year = date.getFullYear()\r\n const _months : number[] = []\r\n const _month : number = date.getMonth() + 1\r\n const _days : number[] = []\r\n const _day = date.getDate()\r\n for (let i = 2000; i <= _year; i++) {\r\n _years.push(i)\r\n }\r\n for (let i = 1; i <= 12; i++) {\r\n _months.push(i)\r\n }\r\n for (let i = 1; i <= 31; i++) {\r\n _days.push(i)\r\n }\r\n return {\r\n title: 'picker-view',\r\n years: _years as number[],\r\n year: _year as number,\r\n months: _months as number[],\r\n month: _month as number,\r\n days: _days as number[],\r\n day: _day as number,\r\n value: [_year - 2000, _month - 1, _day - 1] as number[],\r\n result: [] as number[],\r\n indicatorStyle: 'height: 50px;',\r\n maskTopStyle: '',\r\n maskBottomStyle: ''\r\n }\r\n },\r\n methods: {\n // 自动化测试\n getEventCallbackNum() : number {\n return state.eventCallbackNum\n },\n // 自动化测试\n setEventCallbackNum(num : number) {\n setEventCallbackNum(num)\n },\r\n bindChange(e : UniPickerViewChangeEvent) {\n // 自动化测试\n console.log(e.target?.tagName,e.type);\n if ((e.target?.tagName ?? '').includes('PICKER-VIEW')) {\n this.setEventCallbackNum(state.eventCallbackNum + 1)\n }\n if (e.type === 'change') {\n this.setEventCallbackNum(state.eventCallbackNum + 2)\n }\n\r\n const val = e.detail.value\r\n this.result = val\r\n this.year = this.years[val[0]]\r\n this.month = this.months[val[1]]\r\n this.day = this.days[val[2]]\r\n },\r\n setValue() {\r\n this.value = [0, 0, 0] as number[]\r\n },\r\n setValue1() {\r\n this.value = [10, 10, 10] as number[]\r\n },\r\n }\r\n }\r\n\n```\n:::","children":"### 子组件 @children-tags \n - [picker-view-column](picker-view-column.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker-view.picker-view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker-view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"radio":{"name":"## radio","description":"> 组件类型:UniRadioElement \n\n 单选项。在1组radio-group中只能选中1个","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | false | | 是否禁用 |\n| value | string | - | | \\ 标识。当该radio 选中时,radio-group的 change 事件会携带radio的value |\n| checked | boolean | false | | \\ 当前是否选中 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio默认的背景颜色 |\n| borderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#d1d1d1\" | | radio默认的边框颜色 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007AFF\" | | radio选中时的背景颜色,优先级大于color属性 |\n| activeBorderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | radio选中时的边框颜色 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio的图标颜色 |\n| ~~iconColor~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio的图标颜色 (使用foreColor替代) |\n| ~~color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007AFF\" | | radio的颜色 (使用foreColor替代) |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/radio/radio.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/radio/radio\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type ItemType = {\n value : string\n name : string\n }\n export default {\n data() {\n return {\n items: [\n {\n value: 'CHN',\n name: '中国',\n },\n {\n value: 'USA',\n name: '美国',\n },\n\n {\n value: 'BRA',\n name: '巴西',\n },\n {\n value: 'JPN',\n name: '日本',\n },\n {\n value: 'ENG',\n name: '英国',\n },\n {\n value: 'FRA',\n name: '法国',\n },\n ] as ItemType[],\n current: 0,\n eventTest: false,\n\n value: '',\n text: '未选中',\n wrapText: 'uni-app x,终极跨平台方案\\nuts,大一统语言',\n disabled: true,\n checked: true,\n color: '#007aff',\n // 组件属性 autotest\n checked_boolean: false,\n disabled_boolean: false,\n color_input: \"#007AFF\",\n backgroundColor_input: \"#ffffff\",\n borderColor_input: \"#d1d1d1\",\n activeBackgroundColor_input: \"#007AFF\",\n activeBorderColor_input: \"\",\n iconColor_input: \"#ffffff\"\n }\n },\n\n methods: {\n radioChange(e : UniRadioGroupChangeEvent) {\n\n // 自动化测试\n console.log('test: radio event detail', e.target?.tagName, e.type)\n if ((e.target?.tagName ?? '') == 'RADIO-GROUP' && e.type == 'change') {\n this.eventTest = true\n }\n\n const selected = this.items.find((item) : boolean => {\n return item.value == e.detail.value\n })\n uni.showToast({\n icon: 'none',\n title: '当前选中:' + selected?.name,\n })\n },\n testChange(e : UniRadioGroupChangeEvent) {\n\n this.value = e.detail.value\n },\n radio_click() { console.log(\"组件被点击时触发\") },\n radio_touchstart() { console.log(\"手指触摸动作开始\") },\n radio_touchmove() { console.log(\"手指触摸后移动\") },\n radio_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\n radio_touchend() { console.log(\"手指触摸动作结束\") },\n radio_tap() { console.log(\"手指触摸后马上离开\") },\n radio_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\n change_checked_boolean(checked : boolean) { this.checked_boolean = checked },\n change_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\n confirm_color_input(value : string) { this.color_input = value },\n confirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\n confirm_borderColor_input(value : string) { this.borderColor_input = value },\n confirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\n confirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\n confirm_iconColor_input(value : string) { this.iconColor_input = value }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.radio.radio)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/radio.html#radio)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=radio&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=radio&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=radio&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=radio&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=radio&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=radio)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=radio&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"radio-group":{"name":"## radio-group","description":"> 组件类型:UniRadioGroupElement \n\n 单选框组","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| @change | (event: [UniRadioGroupChangeEvent](#uniradiogroupchangeevent)) => void | - | | radio-group 中的选中项发生变化时触发 change 事件,event.detail = {value: 选中项radio的value} |","event":"\n### 事件\n#### UniRadioGroupChangeEvent\n\n```mermaid\ngraph LR\n \nUniRadioGroupChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"","children":"### 子组件 @children-tags \n - [radio](radio.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.radio.radio-group)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/radio.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=radio-group&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=radio-group&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=radio-group&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=radio-group&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=radio-group&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=radio-group)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=radio-group&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"slider":{"name":"## slider","description":"> 组件类型:UniSliderElement \n\n 滑动选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| disabled | boolean | - | | 是否禁用 |\n| min | number | 0 | | slider 最小值 |\n| max | number | 100 | | slider 最大值 |\n| step | number | 1 | | slider 步长,取值必须大于 0,并且可被(max - min)整除 |\n| value | number | 0 | | radio当前取值 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | slider 滑块左侧已选择部分的线条颜色 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#e9e9e9\" | | radio背景条的颜色 |\n| block-size | number | 28 | | radio滑块的大小,取值范围为 12 - 28 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | slider 的滑块背景颜色 |\n| show-value | boolean | false | | 是否显示当前 value |\n| @change | (event: [UniSliderChangeEvent](#unisliderchangeevent)) => void | - | | 完成一次拖动后触发的事件,event.detail = {value: value} |\n| @changing | (event: [UniSliderChangeEvent](#unisliderchangeevent)) => void | - | | 拖动过程中触发的事件,event.detail = {value: value} |\n| ~~block-color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | 滑块颜色 (使用foreColor替代) |\n| ~~activeColor~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | slider 滑块左侧已选择部分的线条颜色 |","event":"\n### 事件\n#### UniSliderChangeEvent\n\n```mermaid\ngraph LR\n \nUniSliderChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/slider/slider.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/slider/slider\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n sliderValue: 50,\n sliderBlockSize: 20,\n sliderBackgroundColor: \"#000000\",\n sliderActiveColor: \"#FFCC33\",\n sliderBlockColor: \"#8A6DE9\",\n // 组件属性 autotest\n show_value_boolean: false,\n disabled_boolean: false,\n min_input: 0,\n max_input: 100,\n step_input: 1,\n value_input: 0,\n activeColor_input: \"#007aff\",\n backgroundColor_input: \"#e9e9e9\",\n block_size_input: 28,\n block_color_input: \"#ffffff\",\n valueColor: \"#888888\",\n };\n },\n methods: {\n sliderChange(e : UniSliderChangeEvent) {\n console.log(\"value 发生变化:\" + e.detail.value);\n },\n slider_click() {\n console.log(\"组件被点击时触发\");\n },\n slider_touchstart() {\n console.log(\"手指触摸动作开始\");\n },\n slider_touchmove() {\n console.log(\"手指触摸后移动\");\n },\n slider_touchcancel() {\n console.log(\"手指触摸动作被打断,如来电提醒,弹窗\");\n },\n slider_touchend() {\n console.log(\"手指触摸动作结束\");\n },\n slider_tap() {\n console.log(\"手指触摸后马上离开\");\n },\n slider_longpress() {\n console.log(\n \"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\"\n );\n },\n slider_change() {\n console.log(\"完成一次拖动后触发的事件,event.detail = {value: value}\");\n },\n slider_changing() {\n console.log(\"拖动过程中触发的事件,event.detail = {value: value}\");\n },\n change_show_value_boolean(checked : boolean) {\n this.show_value_boolean = checked;\n },\n change_disabled_boolean(checked : boolean) {\n this.disabled_boolean = checked;\n },\n confirm_min_input(value : number) {\n this.min_input = value;\n },\n confirm_max_input(value : number) {\n this.max_input = value;\n },\n confirm_step_input(value : number) {\n this.step_input = value;\n },\n confirm_value_input(value : number) {\n this.value_input = value;\n },\n confirm_activeColor_input(value : string) {\n this.activeColor_input = value;\n },\n confirm_backgroundColor_input(value : string) {\n this.backgroundColor_input = value;\n },\n confirm_block_size_input(value : number) {\n this.block_size_input = value;\n },\n confirm_block_color_input(value : string) {\n this.block_color_input = value;\n },\n confirm_value_color_input(value : string) {\n this.valueColor = value;\n },\n },\n };\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.slider)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/slider.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=slider&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=slider&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=slider&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=slider&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=slider&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=slider)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=slider&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"switch":{"name":"## switch","description":"> 组件类型:UniSwitchElement \n\n 开关选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| checked | boolean | - | | 是否选中 |\n| type | string | - | | 样式,有效值:switch, checkbox |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| switch | | - |\n@| checkbox | | - |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的关闭状态背景颜色 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的开启状态背景颜色 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的滑块背景颜色 |\n| activeForeColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的开启状态下的滑块背景颜色 |\n| disabled | boolean | - | | 是否禁用 |\n| @change | (event: [UniSwitchChangeEvent](#uniswitchchangeevent)) => void | - | | checked 改变时触发 change 事件,event.detail={ value:checked} |\n| ~~color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的颜色,同 css 的 color (使用foreColor替代) |","event":"\n### 事件\n#### UniSwitchChangeEvent\n\n```mermaid\ngraph LR\n \nUniSwitchChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/switch/switch.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/switch/switch\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'switch 开关',\n checked: true,\n color: '#FFCC33',\n clickCheckedValue: true,\n testVerifyEvent: false,\n }\n },\n methods: {\n switch1Change: function (e : UniSwitchChangeEvent) {\n this.clickCheckedValue = e.detail.value\n console.log('switch1 发生 change 事件,携带值为', e.detail.value)\n\n // 仅测试\n this.testVerifyEvent = (e.type == 'change' && (e.target?.tagName ?? '') == \"SWITCH\")\n },\n switch2Change: function (e : UniSwitchChangeEvent) {\n console.log('switch2 发生 change 事件,携带值为', e.detail.value)\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.switch)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/switch.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=switch&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=switch&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=switch&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=switch&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=switch&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=switch)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=switch&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"textarea":{"name":"## textarea","description":"> 组件类型:[UniTextareaElement](/dom/unitextareaelement.md) \n\n 多行输入框","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| value | string | \"\" | | 输入框的初始内容 |\n| placeholder | string | \"\" | | 输入框为空时占位符 |\n| placeholder-style | string | \"\" | | 指定 placeholder 的样式 |\n| placeholder-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"\" | | 指定 placeholder 的样式类,目前仅支持color,font-size和font-weight |\n| maxlength | number | \"不限制长度\" | | 最大输入长度,0和正数为合法值,非法值的时候不限制最大长度 |\n| auto-focus | boolean | false | | 自动获取焦点,与`focus`属性对比,此属性只会首次生效。 |\n| focus | boolean | false | | 获取焦点 |\n| confirm-type | return \\| send \\| search \\| next \\| go \\| done | \"return\" | | 设置键盘右下角按钮的文字 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| return | | 换行 |\n@| send | | 发送 |\n@| search | | 搜索 |\n@| next | | 下一个 |\n@| go | | 前往 |\n@| done | | 完成 |\n| cursor | number | 0 | | 指定focus时的光标位置 |\n| confirm-hold | boolean | false | | 点击键盘右下角按钮时是否保持键盘不收起 |\n| auto-height | boolean | false | | 是否自动增高,设置auto-height时,style.height不生效 |\n| cursor-spacing | number | 0 | | 指定光标与键盘的距离,单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| cursor-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | 指定光标颜色 |\n| selection-start | number | -1 | | 光标起始位置,自动聚集时有效,需与selection-end搭配使用 |\n| selection-end | number | -1 | | 光标结束位置,自动聚集时有效,需与selection-satrt搭配使用 |\n| adjust-position | boolean | true | | 键盘弹起时,是否自动上推页面 |\n| hold-keyboard | boolean | false | | focus时,点击页面的时候不收起键盘 |\n| @confirm | (event: [UniInputConfirmEvent](#uniinputconfirmevent)) => void | - | | 点击完成时, 触发 confirm 事件,event.detail = {value: value} |\n| @input | (event: [UniInputEvent](#uniinputevent)) => void | - | | 当键盘输入时,触发 input 事件,event.detail = {value, cursor}, @input 处理函数的返回值并不会反映到 textarea 上 |\n| @linechange | (event: [UniTextareaLineChangeEvent](#unitextarealinechangeevent)) => void | - | | 输入框行数变化时调用,event.detail = {height: 0, heightRpx: 0, lineCount: 0} |\n| @blur | (event: [UniTextareaBlurEvent](#unitextareablurevent)) => void | - | | 输入框失去焦点时触发,event.detail = {value, cursor} |\n| @keyboardheightchange | (event: [UniInputKeyboardHeightChangeEvent](#uniinputkeyboardheightchangeevent)) => void | - | | 键盘高度发生变化的时候触发此事件,event.detail = {height: height, duration: duration} |\n| @focus | (event: [UniTextareaFocusEvent](#unitextareafocusevent)) => void | - | | 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度,在基础库 1.9.90 起支持 |","event":"\n### 事件\n#### UniInputConfirmEvent\n\n```mermaid\ngraph LR\n \nUniInputConfirmEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputConfirmEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputConfirmEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n\n\n#### UniInputEvent\n\n```mermaid\ngraph LR\n \nUniInputEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 光标的位置 |\n@| keyCode | number | 是 | - | - | 输入字符的Unicode值 |\n\n\n#### UniTextareaLineChangeEvent\n\n```mermaid\ngraph LR\n \nUniTextareaLineChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaLineChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaLineChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| lineCount | number | 是 | - | - | 行数 |\n@| heightRpx | number | 是 | - | - | textarea的高度 |\n@| height | number | 是 | - | - | textarea的高度 |\n\n\n#### UniTextareaBlurEvent\n\n```mermaid\ngraph LR\n \nUniTextareaBlurEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaBlurEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaBlurEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 选择区域的起始位置 |\n\n\n#### UniInputKeyboardHeightChangeEvent\n\n```mermaid\ngraph LR\n \nUniInputKeyboardHeightChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputKeyboardHeightChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputKeyboardHeightChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | - | 键盘高度 |\n@| duration | number | 是 | - | - | 持续时间 |\n\n\n#### UniTextareaFocusEvent\n\n```mermaid\ngraph LR\n \nUniTextareaFocusEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaFocusEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaFocusEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | | 键盘高度 |\n@| value | string | 是 | - | - | 输入框内容 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/textarea/textarea.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/textarea/textarea\n>Template\n```vue\n\n\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n nickname: '',\n gender: '0',\n age: 18,\n loves: ['0'],\n switch: true,\n comment:'',\n formData: {} as UTSJSONObject,\n // 仅测试\n testVerifySubmit: false,\n testVerifyReset: false,\n }\n },\n computed: {\n formDataText() : string {\n return JSON.stringify(this.formData)\n }\n },\n methods: {\n onFormSubmit: function (e : UniFormSubmitEvent) {\n console.log(e.target?.tagName ?? '123');\n console.log(e.type);\n this.formData = e.detail.value\n\n // 仅测试\n this.testVerifySubmit = (e.type == 'submit' && (e.target?.tagName ?? '') == \"FORM\")\n },\n onFormReset: function (e : UniFormResetEvent) {\n this.formData = {}\n\n // 仅测试\n this.testVerifyReset = (e.type == 'reset' && (e.target?.tagName ?? '') == \"FORM\")\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.form)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/form.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=form&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=form&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=form&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=form&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=form&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=form)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=form&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"input":{"name":"## input","description":"> 组件类型:[UniInputElement](/dom/uniinputelement.md) \n\n 输入框","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| disabled | boolean | false | | 是否禁用 |\n| value | string | \"\" | | 输入框的初始内容 |\n| type | text \\| number \\| digit \\| tel | \"text\" | | input的类型 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| text | | 文本输入键盘 |\n@| number | | 数字输入键盘 |\n@| digit | | 带小数点数字输入键盘 |\n@| tel | | 电话输入键盘 |\n| password | boolean | false | | 是否是密码类型 |\n| placeholder | string | \"\" | | 输入框为空时占位符 |\n| placeholder-style | string | \"\" | | 指定 placeholder 的样式 |\n| placeholder-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"\" | | 指定 placeholder 的样式类,目前仅支持color,font-size和font-weight |\n| maxlength | number | \"不限制长度\" | | 最大输入长度,0和正数为合法值,非法值的时候不限制最大长度 |\n| cursor-spacing | number | 0 | | 指定光标与键盘的距离,单位 px 。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| cursor-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | 指定光标颜色 |\n| auto-focus | boolean | false | | 自动获取焦点,与`focus`属性对比,此属性只会首次生效。 |\n| focus | boolean | false | | 获取焦点 |\n| confirm-type | send \\| search \\| next \\| go \\| done | \"done\" | | 设置键盘右下角按钮的文字,仅在 type为text 时生效。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| send | | 发送 |\n@| search | | 搜索 |\n@| next | | 下一个 |\n@| go | | 前往 |\n@| done | | 完成 |\n| confirm-hold | boolean | false | | 点击键盘右下角按钮时是否保持键盘不收起 |\n| cursor | number | 0 | | 指定focus时的光标位置 |\n| selection-start | number | -1 | | 光标起始位置,自动聚集时有效,需与selection-end搭配使用 |\n| selection-end | number | -1 | | 光标结束位置,自动聚集时有效,需与selection-satrt搭配使用 |\n| adjust-position | boolean | true | | 键盘弹起时,是否自动上推页面 |\n| hold-keyboard | boolean | false | | focus时,点击页面的时候不收起键盘 |\n| inputmode | none \\| text \\| decimal \\| numeric \\| tel \\| search \\| email \\| url | \"text\" | | 是一个枚举属性,它提供了用户在编辑元素或其内容时可能输入的数据类型的提示。在符合条件的高版本webview里,uni-app的 web 和 app-vue 平台中可使用本属性。 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| none | | 无虚拟键盘。在应用程序或者站点需要实现自己的键盘输入控件时很有用。 |\n@| text | | 使用用户本地区域设置的标准文本输入键盘。 |\n@| decimal | | 小数输入键盘,包含数字和分隔符(通常是“ . ”或者“ , ”),设备可能也可能不显示减号键。 |\n@| numeric | | 数字输入键盘,所需要的就是 0 到 9 的数字,设备可能也可能不显示减号键。 |\n@| tel | | 电话输入键盘,包含 0 到 9 的数字、星号(*)和井号(#)键。表单输入里面的电话输入通常应该使用 \\ 。 |\n@| search | | 为搜索输入优化的虚拟键盘,比如,返回键可能被重新标记为“搜索”,也可能还有其他的优化。 |\n@| email | | 为邮件地址输入优化的虚拟键盘,通常包含\"@\"符号和其他优化。表单里面的邮件地址输入应该使用 \\ 。 |\n@| url | | 为网址输入优化的虚拟键盘,比如,“/”键会更加明显、历史记录访问等。表单里面的网址输入通常应该使用 \\ 。 |\n| @input | (event: [UniInputEvent](#uniinputevent)) => void | - | | 当键盘输入时,触发input事件,event.detail = {value, cursor},处理函数可以直接 return 一个字符串,将替换输入框的内容。 |\n| @focus | (event: [UniInputFocusEvent](#uniinputfocusevent)) => void | - | | 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度 |\n| @blur | (event: [UniInputBlurEvent](#uniinputblurevent)) => void | - | | 输入框失去焦点时触发,event.detail = {value: value} |\n| @keyboardheightchange | (event: [UniInputKeyboardHeightChangeEvent](#uniinputkeyboardheightchangeevent)) => void | - | | 键盘高度发生变化的时候触发此事件,event.detail = {height: height, duration: duration} |\n| @confirm | (event: [UniInputConfirmEvent](#uniinputconfirmevent)) => void | - | | 点击完成按钮时触发,event.detail = {value: value} |","event":"\n### 事件\n#### UniInputEvent\n\n```mermaid\ngraph LR\n \nUniInputEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 光标的位置 |\n@| keyCode | number | 是 | - | - | 输入字符的Unicode值 |\n\n\n#### UniInputFocusEvent\n\n```mermaid\ngraph LR\n \nUniInputFocusEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputFocusEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputFocusEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | | 键盘高度 |\n@| value | string | 是 | - | - | 输入框内容 |\n\n\n#### UniInputBlurEvent\n\n```mermaid\ngraph LR\n \nUniInputBlurEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputBlurEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputBlurEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 选择区域的起始位置 |\n\n\n#### UniInputKeyboardHeightChangeEvent\n\n```mermaid\ngraph LR\n \nUniInputKeyboardHeightChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputKeyboardHeightChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputKeyboardHeightChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | - | 键盘高度 |\n@| duration | number | 是 | - | - | 持续时间 |\n\n\n#### UniInputConfirmEvent\n\n```mermaid\ngraph LR\n \nUniInputConfirmEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputConfirmEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputConfirmEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/input/input.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/input/input\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'input',\n showClearIcon: false,\n inputClearValue: '',\n showPassword: true,\n cursor: -1,\n cursor_color: \"#3393E2\",\n selectionStart: -1,\n selectionEnd: -1,\n inputEventDetail: '',\n focusAndBlurEventDetail: '',\n confirmEventDetail: '',\n keyboardHeightChangeEventDetail: '',\n focus: true,\n inputPassword: true,\n inputTypeTel: \"tel\",\n inputPlaceHolderStyle: \"color:red\",\n inputPlaceHolderClass: \"uni-input-placeholder-class\" as string.ClassString ,\n inputMaxLengthValue: \"\",\n onMaxLengthInputValue: \"\",\n inputMaxLengthFocus: false,\n inputPasswordValue: \"cipher\",\n inputFocusKeyBoardChangeValue: true,\n holdKeyboard: false,\n keyboardHeight: 0,\n focusedForKeyboardHeightChangeTest: false,\n demoValue: '123',\n adjustPosition: false\n }\n },\n methods: {\n inputFocusKeyBoardChange(e : UniInputKeyboardHeightChangeEvent) {\n this.inputFocusKeyBoardChangeValue = e.detail.height > 50\n },\n onMaxLengthInput(event : UniInputEvent) {\n this.onMaxLengthInputValue = event.detail.value\n },\n setCursor: function (cursor : number) {\n (this.$refs['input'] as UniInputElement).focus();\n this.cursor = cursor;\n },\n onCursorBlurChange(){\n this.cursor = 0\n },\n setSelection: function (selectionStart : number, selectionEnd : number) {\n (this.$refs['input2'] as UniInputElement).focus();\n this.selectionStart = selectionStart;\n this.selectionEnd = selectionEnd;\n },\n onSelectionBlurChange(){\n this.selectionEnd = 0;\n },\n clearInput: function (event : UniInputEvent) {\n this.inputClearValue = event.detail.value\n if (event.detail.value.length > 0) {\n this.showClearIcon = true\n } else {\n this.showClearIcon = false\n }\n },\n clearIcon: function () {\n this.inputClearValue = ''\n this.showClearIcon = false\n },\n changePassword: function () {\n this.showPassword = !this.showPassword\n },\n onInput: function (event : UniInputEvent) {\n console.log(\"键盘输入\", JSON.stringify(event.detail));\n this.inputEventDetail = JSON.stringify(event.detail)\n },\n onFocus: function (event : UniInputFocusEvent) {\n console.log(\"输入框聚焦\", JSON.stringify(event.detail));\n this.focusAndBlurEventDetail = JSON.stringify(event.detail);\n },\n onBlur: function (event : UniInputBlurEvent) {\n console.log(\"输入框失去焦点\", JSON.stringify(event.detail));\n this.focusAndBlurEventDetail = JSON.stringify(event.detail);\n },\n onConfirm: function (event : UniInputConfirmEvent) {\n console.log(\"点击完成按钮\", JSON.stringify(event.detail));\n this.confirmEventDetail = JSON.stringify(event.detail);\n },\n onKeyborardHeightChange: function (event : UniInputKeyboardHeightChangeEvent) {\n console.log(\"键盘高度发生变化\", JSON.stringify(event.detail));\n this.keyboardHeightChangeEventDetail = JSON.stringify(event.detail);\n this.keyboardHeight = event.detail.height;\n },\n test_check_input_value() : number {\n return this.onMaxLengthInputValue.length\n },\n changeCursorColor(event : UniSwitchChangeEvent) {\n const checked = event.detail.value;\n if (checked) {\n this.cursor_color = \"red\"\n } else {\n this.cursor_color = \"#3393E2\"\n }\n const input = uni.getElementById(\"uni-input-cursor-color\")\n input?.focus()\n },\n changeHoldKeyboard(event : UniSwitchChangeEvent) {\n const checked = event.detail.value;\n this.holdKeyboard = checked\n },\n changeAdjustPosition(event : UniSwitchChangeEvent){\n const checked = event.detail.value;\n this.adjustPosition = checked\n }\n }\n }\n\n```\n:::","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.input)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/input.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=input&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=input&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=input&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=input&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=input&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=input)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=input&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"editor":{"name":"## editor","description":"富文本编辑器,可以对图片、文字进行编辑。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| read-only | boolean | - | | 设置编辑器为只读。 |\n| placeholder | string | - | | 提示信息。 |\n| show-img-size | boolean | - | | 点击图片时显示图片大小控件。 |\n| show-img-toolbar | boolean | - | | 点击图片时显示工具栏控件。 |\n| show-img-resize | string | - | | 点击图片时显示修改尺寸控件。 |\n| @ready | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器初始化完成时触发 |\n| @focus | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器聚焦时触发,event.detail = {html, text, delta} |\n| @blur | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器失去焦点时触发,detail = {html, text, delta} |\n| @input | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 编辑器内容改变时触发,detail = {html, text, delta} |\n| @statuschange | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 通过 Context 方法改变编辑器内样式时触发,返回选区已设置的样式 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/editor/editor.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/editor/editor\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type Context = {\n \tid?: string;\n \tpageId?: number;\n }\n\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\treadOnly: false,\n\t\t\t\tformats: {},\n editorCtx:{} as Context,\n // 自动化测试\n autoTest:false,\n undoTest:false,\n redoTest:false,\n removeFormatTest:false\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tuni.loadFontFace({\n\t\t\t\tfamily: 'Pacifico',\n\t\t\t\tsource: 'url(\"/static/font/Pacifico-Regular.ttf\")',\n\t\t\t\tsuccess() {\n\t\t\t\t\tconsole.log('success load font')\n\t\t\t\t},\n\t\t\t\tfail() {\n\t\t\t\t\tconsole.log('fail load font load')\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\t\tmethods: {\n\t\t\treadOnlyChange() {\n\t\t\t\tthis.readOnly = !this.readOnly\n\t\t\t},\n\t\t\tonEditorReady() {\n\t\t\t\tuni.createSelectorQuery().select('#editor').context((res) => {\n\t\t\t\t\tthis.editorCtx = res.context\n\t\t\t\t}).exec()\n\t\t\t},\n // 自动化测试专用\n setContents(options) {\n \tthis.editorCtx.setContents({\n delta: {\n ops:options\n },\n success: (res) => {\n \tconsole.log('setContents-success', res)\n },\n fail: (err) => {\n \tconsole.log(err)\n }\n \t})\n },\n getCon() {\n \tthis.editorCtx.getContents({\n \t\tsuccess: (res) => {\n \t\t\tconsole.log('文本详情:', res)\n \t\t},\n \t\tfail: (err) => {\n \t\t\tconsole.log(err)\n \t\t}\n \t})\n },\n\t\t\tundo() {\n\t\t\t\tthis.editorCtx.undo({\n \t\tsuccess: (res) => {\n this.undoTest = true\n \t\t},\n \t\tfail: (err) => {\n this.undoTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tredo() {\n\t\t\t\tthis.editorCtx.redo({\n \t\tsuccess: (res) => {\n this.redoTest = true\n \t\t},\n \t\tfail: (err) => {\n this.redoTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tformat(e) {\n\t\t\t\tlet {name,value} = e.target.dataset\n\t\t\t\tif (!name) return\n\t\t\t\t// console.log('format', name, value)\n\t\t\t\tthis.editorCtx.format(name, value)\n\t\t\t},\n\t\t\tonStatusChange(e) {\n\t\t\t\tconst formats = e.detail\n\t\t\t\tthis.formats = formats\n\t\t\t},\n\t\t\tinsertDivider() {\n\t\t\t\tthis.editorCtx.insertDivider({\n\t\t\t\t\tsuccess: function() {\n\t\t\t\t\t\tconsole.log('insert divider success')\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t},\n clear() {\n this.editorCtx.clear({\n success: function(res) {\n console.log(\"clear success\")\n }\n })\n },\n\t\t\tclearShowModal() {\n uni.showModal({\n \ttitle: '清空编辑器',\n \tcontent: '确定清空编辑器全部内容?',\n \tsuccess: res => {\n \t\tif (res.confirm) {\n \t\t\tthis.clear()\n \t\t}\n \t}\n })\n\t\t\t},\n\t\t\tremoveFormat() {\n\t\t\t\tthis.editorCtx.removeFormat({\n \t\tsuccess: (res) => {\n \t\t\tconsole.log('removeFormat-success', res)\n this.removeFormatTest = true\n \t\t},\n \t\tfail: (err) => {\n this.removeFormatTest = false\n \t\t}\n \t})\n\t\t\t},\n\t\t\tinsertDate() {\n\t\t\t\tconst date = new Date()\n\t\t\t\tconst formatDate = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`\n\t\t\t\tthis.editorCtx.insertText({\n\t\t\t\t\ttext: formatDate\n\t\t\t\t})\n\t\t\t},\n insertImage(image){\n this.editorCtx.insertImage({\n src:image,\n alt: '图像',\n success: function() {\n console.log('insert image success')\n }\n })\n },\n\t\t\tchooseInsertImage() {\n uni.chooseImage({\n \tcount: 1,\n \tsuccess: (res) => {\n \t\tthis.insertImage(res.tempFilePaths[0])\n \t}\n })\n\t\t\t}\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.editor)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/editor.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=editor&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=editor&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=editor&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=editor&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=editor&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=editor)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=editor&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"label":{"name":"## label","description":"用来改进表单组件的可用性,使用for属性找到对应的id,或者将控件放在该标签下,当点击时,就会触发对应的控件","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | - | | 是否禁用 |\n| for | string | - | | 绑定控件的 id |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/label/label.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/label/label\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'label',\n checkboxItems: [{\n name: 'USA',\n value: '美国'\n },\n {\n name: 'CHN',\n value: '中国',\n checked: 'true'\n }\n ],\n radioItems: [{\n name: 'USA',\n value: '美国'\n },\n {\n name: 'CHN',\n value: '中国',\n checked: 'true'\n }\n ],\n hidden: false,\n checkboxValue: [] as string[],\n radioValue:''\n }\n },\n methods: {\n checkboxChange: function (e : UniCheckboxGroupChangeEvent) {\n console.log(e.detail.value)\n this.checkboxValue = e.detail.value\n },\n radioChange: function (e : UniRadioGroupChangeEvent) {\n console.log(e.detail.value)\n this.radioValue = e.detail.value\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.label)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/label.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=label&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=label&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=label&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=label&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=label&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=label)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=label&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker":{"name":"## picker","description":"从底部弹起的滚动选择器,现支持五种选择器,通过mode来区分,分别是普通选择器,多列选择器,时间选择器,日期选择器,省市区选择器,默认是普通选择器。","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | x | x |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | - | | 是否禁用 |\n| mode | string | - | | 选择器类型 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| selector | - | 普通选择器 |\n@| multiSelector | - | 多列选择器 |\n@| time | - | 时间选择器 |\n@| date | - | 日期选择器 |\n@| region | - | 省市选择器 |\n| range | array | - | | mode为 selector 或 multiSelector 时,range 有效 |\n| range-key | string | - | | 当 range 是一个 Object Array 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 |\n| value | string | - | | mode为select或multiSelector时:value 的值表示选择了 range 中的第几个(下标从 0 开始);mode为time时:表示选中的时间,格式为\"hh:mm\";mode为date时:表示选中的日期,格式为\"YYYY-MM-DD\";mode为region时:
\t\t表示选中的省市区,默认选中每一列的第一个值。 |\n| start | string | - | | mode为time:表示有效时间范围的开始,字符串格式为\"hh:mm\";mode为date:表示有效日期范围的开始,字符串格式为\"YYYY-MM-DD\" |\n| end | string | - | | mode为time:表示有效时间范围的结束,字符串格式为\"hh:mm\";mode为date:表示有效日期范围的结束,字符串格式为\"YYYY-MM-DD\" |\n| fields | string | - | | 有效值 year,month,day,表示选择器的粒度 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| year | - | 选择器粒度为年 |\n@| month | - | 选择器粒度为月份 |\n@| day | - | 选择器粒度为天 |\n| custom-item | string | - | | 可为每一列的顶部添加一个自定义的项 |\n| @change | (event: [UniEvent](/component/common.md#unievent)) => void | - | | value 改变时触发 change 事件,event.detail = {value: value} |\n| @columnchange | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 某一列的值改变时触发 columnchange 事件,event.detail = {column: column, value: value},column 的值表示改变了第几列(下标从0开始),value 的值表示变更值的下标 |\n| @cancel | (event: [UniEvent](/component/common.md#unievent)) => void | - | | 取消选择时触发 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/picker/picker.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/picker/picker\n>Template\n```vue\n\n\n\n\n\n```\n>Script\n```uts\n\n\n\tfunction getDate(type?:string):string {\n\t\tconst date = new Date();\n\n\t\tlet year:string | number = date.getFullYear();\n\t\tlet month:string | number = date.getMonth() + 1;\n\t\tlet day:string | number = date.getDate();\n\n\t\tif (type === 'start') {\n\t\t\tyear = year - 10;\n\t\t} else if (type === 'end') {\n\t\t\tyear = year + 10;\n\t\t}\n\t\tmonth = month > 9 ? month : '0' + month;;\n\t\tday = day > 9 ? day : '0' + day;\n\n\t\treturn `${year}-${month}-${day}`;\n\t}\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\ttitle: 'picker',\n\t\t\t\tarray: [{name:'中国'},{name: '美国'}, {name:'巴西'}, {name:'日本'}],\n\t\t\t\tindex: 0,\n\t\t\t\tmultiArray: [\n\t\t\t\t\t['亚洲', '欧洲'],\n\t\t\t\t\t['中国', '日本'],\n\t\t\t\t\t['北京', '上海', '广州']\n\t\t\t\t],\n\t\t\t\tmultiIndex: [0, 0, 0],\n date:getDate(),\n\t\t\t\tstartDate:getDate('start'),\n\t\t\t\tendDate:getDate('end'),\n\t\t\t\ttime: '12:01'\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tbindPickerChange: function(e) {\n\t\t\t\tconsole.log('picker发送选择改变,携带值为:' + e.detail.value)\n\t\t\t\tthis.index = e.detail.value\n\t\t\t},\n\t\t\tbindMultiPickerColumnChange: function(e) {\n\t\t\t\tconsole.log('修改的列为:' + e.detail.column + ',值为:' + e.detail.value)\n\t\t\t\tthis.multiIndex[e.detail.column] = e.detail.value\n\t\t\t\tswitch (e.detail.column) {\n\t\t\t\t\tcase 0: //拖动第1列\n\t\t\t\t\t\tswitch (this.multiIndex[0]) {\n\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\tthis.multiArray[1] = ['中国', '日本']\n\t\t\t\t\t\t\t\tthis.multiArray[2] = ['北京', '上海', '广州']\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\tthis.multiArray[1] = ['英国', '法国']\n\t\t\t\t\t\t\t\tthis.multiArray[2] = ['伦敦', '曼彻斯特']\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.multiIndex.splice(1, 1, 0)\n\t\t\t\t\t\tthis.multiIndex.splice(2, 1, 0)\n\t\t\t\t\t\tbreak\n\t\t\t\t\tcase 1: //拖动第2列\n\t\t\t\t\t\tswitch (this.multiIndex[0]) { //判断第一列是什么\n\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\tswitch (this.multiIndex[1]) {\n\t\t\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['北京', '上海', '广州']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['东京','北海道']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\tswitch (this.multiIndex[1]) {\n\t\t\t\t\t\t\t\t\tcase 0:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['伦敦', '曼彻斯特']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tcase 1:\n\t\t\t\t\t\t\t\t\t\tthis.multiArray[2] = ['巴黎', '马赛']\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.multiIndex.splice(2, 1, 0)\n\t\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t\tthis.$forceUpdate()\n\t\t\t},\n\t\t\tbindDateChange: function(e) {\n\t\t\t\tthis.date = e.detail.value\n\t\t\t},\n\t\t\tbindTimeChange: function(e) {\n\t\t\t\tthis.time = e.detail.value\n\t\t\t}\n\t\t}\n\t}\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker-view-column":{"name":"## picker-view-column","description":"仅可放置于 picker-view 中,其子节点未继承 picker-view 的选中框的高度,需要自己设置高度并居中","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"","event":"","example":"","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker-view.picker-view-column)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker-view.html#picker-view-column)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker-view-column&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker-view-column&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker-view-column&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker-view-column&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker-view-column&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker-view-column)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker-view-column&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"picker-view":{"name":"## picker-view","description":"> 组件类型:UniPickerViewElement \n\n 嵌入页面的滚动选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| value | array\\ | - | | picker-view-column 选择的第几项 |\n| indicator-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置选择器中间选中框的样式 |\n| indicator-class | string([string.ClassString](/uts/data-type.md#ide-string)) | - | | 设置选择器中间选中框的类名 |\n| mask-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层的样式 |\n| mask-top-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层上半部分的样式 |\n| mask-bottom-style | string([string.CSSString](/uts/data-type.md#ide-string)) | - | | 设置蒙层下半部分的样式 |\n| mask-class | string([string.ClassString](/uts/data-type.md#ide-string)) | - | | 设置蒙层的类名 |\n| @change | (event: [UniPickerViewChangeEvent](#unipickerviewchangeevent)) => void | - | | 当滚动选择,value 改变时触发 change 事件,event.detail = {value: value};value为数组,表示 picker-view 内的 picker-view-column 当前选择的是第几项(下标从 0
\t\t开始) |","event":"\n### 事件\n#### UniPickerViewChangeEvent\n\n```mermaid\ngraph LR\n \nUniPickerViewChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/picker-view/picker-view.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/picker-view/picker-view\n>Template\n```vue\n\r\n\r\n\r\n\r\n\n\n```\n>Script\n```uts\n\n import { state, setEventCallbackNum } from '@/store/index.uts'\r\n export default {\r\n data() {\r\n const date = new Date()\r\n const _years : number[] = []\r\n const _year = date.getFullYear()\r\n const _months : number[] = []\r\n const _month : number = date.getMonth() + 1\r\n const _days : number[] = []\r\n const _day = date.getDate()\r\n for (let i = 2000; i <= _year; i++) {\r\n _years.push(i)\r\n }\r\n for (let i = 1; i <= 12; i++) {\r\n _months.push(i)\r\n }\r\n for (let i = 1; i <= 31; i++) {\r\n _days.push(i)\r\n }\r\n return {\r\n title: 'picker-view',\r\n years: _years as number[],\r\n year: _year as number,\r\n months: _months as number[],\r\n month: _month as number,\r\n days: _days as number[],\r\n day: _day as number,\r\n value: [_year - 2000, _month - 1, _day - 1] as number[],\r\n result: [] as number[],\r\n indicatorStyle: 'height: 50px;',\r\n maskTopStyle: '',\r\n maskBottomStyle: ''\r\n }\r\n },\r\n methods: {\n // 自动化测试\n getEventCallbackNum() : number {\n return state.eventCallbackNum\n },\n // 自动化测试\n setEventCallbackNum(num : number) {\n setEventCallbackNum(num)\n },\r\n bindChange(e : UniPickerViewChangeEvent) {\n // 自动化测试\n console.log(e.target?.tagName,e.type);\n if ((e.target?.tagName ?? '').includes('PICKER-VIEW')) {\n this.setEventCallbackNum(state.eventCallbackNum + 1)\n }\n if (e.type === 'change') {\n this.setEventCallbackNum(state.eventCallbackNum + 2)\n }\n\r\n const val = e.detail.value\r\n this.result = val\r\n this.year = this.years[val[0]]\r\n this.month = this.months[val[1]]\r\n this.day = this.days[val[2]]\r\n },\r\n setValue() {\r\n this.value = [0, 0, 0] as number[]\r\n },\r\n setValue1() {\r\n this.value = [10, 10, 10] as number[]\r\n },\r\n }\r\n }\r\n\n```\n:::","children":"### 子组件 @children-tags \n - [picker-view-column](picker-view-column.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.picker-view.picker-view)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/picker-view.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=picker-view&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=picker-view&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=picker-view&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=picker-view&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=picker-view&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=picker-view)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=picker-view&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"radio":{"name":"## radio","description":"> 组件类型:UniRadioElement \n\n 单选项。在1组radio-group中只能选中1个","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| disabled | boolean | false | | 是否禁用 |\n| value | string | - | | \\ 标识。当该radio 选中时,radio-group的 change 事件会携带radio的value |\n| checked | boolean | false | | \\ 当前是否选中 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio默认的背景颜色 |\n| borderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#d1d1d1\" | | radio默认的边框颜色 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007AFF\" | | radio选中时的背景颜色,优先级大于color属性 |\n| activeBorderColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | radio选中时的边框颜色 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio的图标颜色 |\n| ~~iconColor~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | radio的图标颜色 (使用foreColor替代) |\n| ~~color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007AFF\" | | radio的颜色 (使用foreColor替代) |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/radio/radio.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/radio/radio\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n type ItemType = {\n value : string\n name : string\n }\n export default {\n data() {\n return {\n items: [\n {\n value: 'CHN',\n name: '中国',\n },\n {\n value: 'USA',\n name: '美国',\n },\n\n {\n value: 'BRA',\n name: '巴西',\n },\n {\n value: 'JPN',\n name: '日本',\n },\n {\n value: 'ENG',\n name: '英国',\n },\n {\n value: 'FRA',\n name: '法国',\n },\n ] as ItemType[],\n current: 0,\n eventTest: false,\n\n value: '',\n text: '未选中',\n wrapText: 'uni-app x,终极跨平台方案\\nuts,大一统语言',\n disabled: true,\n checked: true,\n color: '#007aff',\n // 组件属性 autotest\n checked_boolean: false,\n disabled_boolean: false,\n color_input: \"#007AFF\",\n backgroundColor_input: \"#ffffff\",\n borderColor_input: \"#d1d1d1\",\n activeBackgroundColor_input: \"#007AFF\",\n activeBorderColor_input: \"\",\n iconColor_input: \"#ffffff\"\n }\n },\n\n methods: {\n radioChange(e : UniRadioGroupChangeEvent) {\n\n // 自动化测试\n console.log('test: radio event detail', e.target?.tagName, e.type)\n if ((e.target?.tagName ?? '') == 'RADIO-GROUP' && e.type == 'change') {\n this.eventTest = true\n }\n\n const selected = this.items.find((item) : boolean => {\n return item.value == e.detail.value\n })\n uni.showToast({\n icon: 'none',\n title: '当前选中:' + selected?.name,\n })\n },\n testChange(e : UniRadioGroupChangeEvent) {\n\n this.value = e.detail.value\n },\n radio_click() { console.log(\"组件被点击时触发\") },\n radio_touchstart() { console.log(\"手指触摸动作开始\") },\n radio_touchmove() { console.log(\"手指触摸后移动\") },\n radio_touchcancel() { console.log(\"手指触摸动作被打断,如来电提醒,弹窗\") },\n radio_touchend() { console.log(\"手指触摸动作结束\") },\n radio_tap() { console.log(\"手指触摸后马上离开\") },\n radio_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\") },\n change_checked_boolean(checked : boolean) { this.checked_boolean = checked },\n change_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\n confirm_color_input(value : string) { this.color_input = value },\n confirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\n confirm_borderColor_input(value : string) { this.borderColor_input = value },\n confirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\n confirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\n confirm_iconColor_input(value : string) { this.iconColor_input = value }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.radio.radio)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/radio.html#radio)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=radio&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=radio&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=radio&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=radio&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=radio&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=radio)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=radio&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"radio-group":{"name":"## radio-group","description":"> 组件类型:UniRadioGroupElement \n\n 单选框组","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| @change | (event: [UniRadioGroupChangeEvent](#uniradiogroupchangeevent)) => void | - | | radio-group 中的选中项发生变化时触发 change 事件,event.detail = {value: 选中项radio的value} |","event":"\n### 事件\n#### UniRadioGroupChangeEvent\n\n```mermaid\ngraph LR\n \nUniRadioGroupChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"","children":"### 子组件 @children-tags \n - [radio](radio.md)","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.radio.radio-group)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/radio.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=radio-group&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=radio-group&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=radio-group&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=radio-group&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=radio-group&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=radio-group)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=radio-group&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"slider":{"name":"## slider","description":"> 组件类型:UniSliderElement \n\n 滑动选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| disabled | boolean | - | | 是否禁用 |\n| min | number | 0 | | slider 最小值 |\n| max | number | 100 | | slider 最大值 |\n| step | number | 1 | | slider 步长,取值必须大于 0,并且可被(max - min)整除 |\n| value | number | 0 | | radio当前取值 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | slider 滑块左侧已选择部分的线条颜色 |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#e9e9e9\" | | radio背景条的颜色 |\n| block-size | number | 28 | | radio滑块的大小,取值范围为 12 - 28 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | slider 的滑块背景颜色 |\n| show-value | boolean | false | | 是否显示当前 value |\n| @change | (event: [UniSliderChangeEvent](#unisliderchangeevent)) => void | - | | 完成一次拖动后触发的事件,event.detail = {value: value} |\n| @changing | (event: [UniSliderChangeEvent](#unisliderchangeevent)) => void | - | | 拖动过程中触发的事件,event.detail = {value: value} |\n| ~~block-color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#ffffff\" | | 滑块颜色 (使用foreColor替代) |\n| ~~activeColor~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | \"#007aff\" | | slider 滑块左侧已选择部分的线条颜色 |","event":"\n### 事件\n#### UniSliderChangeEvent\n\n```mermaid\ngraph LR\n \nUniSliderChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/slider/slider.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/slider/slider\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n sliderValue: 50,\n sliderBlockSize: 20,\n sliderBackgroundColor: \"#000000\",\n sliderActiveColor: \"#FFCC33\",\n sliderBlockColor: \"#8A6DE9\",\n // 组件属性 autotest\n show_value_boolean: false,\n disabled_boolean: false,\n min_input: 0,\n max_input: 100,\n step_input: 1,\n value_input: 0,\n activeColor_input: \"#007aff\",\n backgroundColor_input: \"#e9e9e9\",\n block_size_input: 28,\n block_color_input: \"#ffffff\",\n valueColor: \"#888888\",\n };\n },\n methods: {\n sliderChange(e : UniSliderChangeEvent) {\n console.log(\"value 发生变化:\" + e.detail.value);\n },\n slider_click() {\n console.log(\"组件被点击时触发\");\n },\n slider_touchstart() {\n console.log(\"手指触摸动作开始\");\n },\n slider_touchmove() {\n console.log(\"手指触摸后移动\");\n },\n slider_touchcancel() {\n console.log(\"手指触摸动作被打断,如来电提醒,弹窗\");\n },\n slider_touchend() {\n console.log(\"手指触摸动作结束\");\n },\n slider_tap() {\n console.log(\"手指触摸后马上离开\");\n },\n slider_longpress() {\n console.log(\n \"如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。\"\n );\n },\n slider_change() {\n console.log(\"完成一次拖动后触发的事件,event.detail = {value: value}\");\n },\n slider_changing() {\n console.log(\"拖动过程中触发的事件,event.detail = {value: value}\");\n },\n change_show_value_boolean(checked : boolean) {\n this.show_value_boolean = checked;\n },\n change_disabled_boolean(checked : boolean) {\n this.disabled_boolean = checked;\n },\n confirm_min_input(value : number) {\n this.min_input = value;\n },\n confirm_max_input(value : number) {\n this.max_input = value;\n },\n confirm_step_input(value : number) {\n this.step_input = value;\n },\n confirm_value_input(value : number) {\n this.value_input = value;\n },\n confirm_activeColor_input(value : string) {\n this.activeColor_input = value;\n },\n confirm_backgroundColor_input(value : string) {\n this.backgroundColor_input = value;\n },\n confirm_block_size_input(value : number) {\n this.block_size_input = value;\n },\n confirm_block_color_input(value : string) {\n this.block_color_input = value;\n },\n confirm_value_color_input(value : string) {\n this.valueColor = value;\n },\n },\n };\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.slider)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/slider.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=slider&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=slider&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=slider&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=slider&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=slider&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=slider)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=slider&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"switch":{"name":"## switch","description":"> 组件类型:UniSwitchElement \n\n 开关选择器","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| checked | boolean | - | | 是否选中 |\n| type | string | - | | 样式,有效值:switch, checkbox |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| switch | | - |\n@| checkbox | | - |\n| backgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的关闭状态背景颜色 |\n| activeBackgroundColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的开启状态背景颜色 |\n| foreColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的滑块背景颜色 |\n| activeForeColor | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的开启状态下的滑块背景颜色 |\n| disabled | boolean | - | | 是否禁用 |\n| @change | (event: [UniSwitchChangeEvent](#uniswitchchangeevent)) => void | - | | checked 改变时触发 change 事件,event.detail={ value:checked} |\n| ~~color~~ | string([string.ColorString](/uts/data-type.md#ide-string)) | - | | switch 的颜色,同 css 的 color (使用foreColor替代) |","event":"\n### 事件\n#### UniSwitchChangeEvent\n\n```mermaid\ngraph LR\n \nUniSwitchChangeEvent -- Extends --> UniCustomEvent\n style UniCustomEvent color:#42b983\n click UniCustomEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent\"\n```","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/switch/switch.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/switch/switch\n>Template\n```vue\n\n\n\n\n\n\n```\n>Script\n```uts\n\n export default {\n data() {\n return {\n title: 'switch 开关',\n checked: true,\n color: '#FFCC33',\n clickCheckedValue: true,\n testVerifyEvent: false,\n }\n },\n methods: {\n switch1Change: function (e : UniSwitchChangeEvent) {\n this.clickCheckedValue = e.detail.value\n console.log('switch1 发生 change 事件,携带值为', e.detail.value)\n\n // 仅测试\n this.testVerifyEvent = (e.type == 'change' && (e.target?.tagName ?? '') == \"SWITCH\")\n },\n switch2Change: function (e : UniSwitchChangeEvent) {\n console.log('switch2 发生 change 事件,携带值为', e.detail.value)\n }\n }\n }\n\n```\n:::","children":"","reference":"\n### 参见\n- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.switch)\n- [参见uni-app相关文档](https://uniapp.dcloud.io/component/switch.html)\n- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=switch&doc_type=miniprogram)\n- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=switch&pageIndex=1&pageSize=10&source=doc_top&type=all)\n- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=switch&scope=devdocs&source=docs)\n- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=switch&secondType=all&type=1)\n- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=switch&topicFilter=)\n- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=switch)\n- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)\n- [快手小程序文档](https://developers.kuaishou.com/page?keyword=switch&from=docs)\n- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)\n- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)\n- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)\n"},"textarea":{"name":"## textarea","description":"> 组件类型:[UniTextareaElement](/dom/unitextareaelement.md) \n\n 多行输入框","compatibility":"\n### 兼容性\n| Web | Android | iOS |\n| :- | :- | :- |\n| 4.0 | 3.9 | 4.11 |\n","attribute":"### 属性 \n| 名称 | 类型 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :-: | :- |\n| name | string | - | | 表单的控件名称,作为键值对的一部分与表单(form组件)一同提交 |\n| value | string | \"\" | | 输入框的初始内容 |\n| placeholder | string | \"\" | | 输入框为空时占位符 |\n| placeholder-style | string | \"\" | | 指定 placeholder 的样式 |\n| placeholder-class | string([string.ClassString](/uts/data-type.md#ide-string)) | \"\" | | 指定 placeholder 的样式类,目前仅支持color,font-size和font-weight |\n| maxlength | number | \"不限制长度\" | | 最大输入长度,0和正数为合法值,非法值的时候不限制最大长度 |\n| auto-focus | boolean | false | | 自动获取焦点,与`focus`属性对比,此属性只会首次生效。 |\n| focus | boolean | false | | 获取焦点 |\n| confirm-type | return \\| send \\| search \\| next \\| go \\| done | \"return\" | | 设置键盘右下角按钮的文字 |\n@| 合法值 | 兼容性 | 描述 |\n@| :- | :-: | :- |\n@| return | | 换行 |\n@| send | | 发送 |\n@| search | | 搜索 |\n@| next | | 下一个 |\n@| go | | 前往 |\n@| done | | 完成 |\n| cursor | number | 0 | | 指定focus时的光标位置 |\n| confirm-hold | boolean | false | | 点击键盘右下角按钮时是否保持键盘不收起 |\n| auto-height | boolean | false | | 是否自动增高,设置auto-height时,style.height不生效 |\n| cursor-spacing | number | 0 | | 指定光标与键盘的距离,单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| cursor-color | string([string.ColorString](/uts/data-type.md#ide-string)) | \"\" | | 指定光标颜色 |\n| selection-start | number | -1 | | 光标起始位置,自动聚集时有效,需与selection-end搭配使用 |\n| selection-end | number | -1 | | 光标结束位置,自动聚集时有效,需与selection-satrt搭配使用 |\n| adjust-position | boolean | true | | 键盘弹起时,是否自动上推页面 |\n| hold-keyboard | boolean | false | | focus时,点击页面的时候不收起键盘 |\n| @confirm | (event: [UniInputConfirmEvent](#uniinputconfirmevent)) => void | - | | 点击完成时, 触发 confirm 事件,event.detail = {value: value} |\n| @input | (event: [UniInputEvent](#uniinputevent)) => void | - | | 当键盘输入时,触发 input 事件,event.detail = {value, cursor}, @input 处理函数的返回值并不会反映到 textarea 上 |\n| @linechange | (event: [UniTextareaLineChangeEvent](#unitextarealinechangeevent)) => void | - | | 输入框行数变化时调用,event.detail = {height: 0, heightRpx: 0, lineCount: 0} |\n| @blur | (event: [UniTextareaBlurEvent](#unitextareablurevent)) => void | - | | 输入框失去焦点时触发,event.detail = {value, cursor} |\n| @keyboardheightchange | (event: [UniInputKeyboardHeightChangeEvent](#uniinputkeyboardheightchangeevent)) => void | - | | 键盘高度发生变化的时候触发此事件,event.detail = {height: height, duration: duration} |\n| @focus | (event: [UniTextareaFocusEvent](#unitextareafocusevent)) => void | - | | 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度,在基础库 1.9.90 起支持 |","event":"\n### 事件\n#### UniInputConfirmEvent\n\n```mermaid\ngraph LR\n \nUniInputConfirmEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputConfirmEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputConfirmEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n\n\n#### UniInputEvent\n\n```mermaid\ngraph LR\n \nUniInputEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 光标的位置 |\n@| keyCode | number | 是 | - | - | 输入字符的Unicode值 |\n\n\n#### UniTextareaLineChangeEvent\n\n```mermaid\ngraph LR\n \nUniTextareaLineChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaLineChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaLineChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| lineCount | number | 是 | - | - | 行数 |\n@| heightRpx | number | 是 | - | - | textarea的高度 |\n@| height | number | 是 | - | - | textarea的高度 |\n\n\n#### UniTextareaBlurEvent\n\n```mermaid\ngraph LR\n \nUniTextareaBlurEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaBlurEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaBlurEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| value | string | 是 | - | - | 输入框内容 |\n@| cursor | number | 是 | - | - | 选择区域的起始位置 |\n\n\n#### UniInputKeyboardHeightChangeEvent\n\n```mermaid\ngraph LR\n \nUniInputKeyboardHeightChangeEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniInputKeyboardHeightChangeEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniInputKeyboardHeightChangeEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | - | 键盘高度 |\n@| duration | number | 是 | - | - | 持续时间 |\n\n\n#### UniTextareaFocusEvent\n\n```mermaid\ngraph LR\n \nUniTextareaFocusEvent -- Extends --> UniEvent\n style UniEvent color:#42b983\n click UniEvent \"https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent\"\n```\n##### UniTextareaFocusEvent 的属性值\n| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 |\n| :- | :- | :- | :- | :-: | :- |\n| detail | **UniTextareaFocusEventDetail** | 是 | - | - | - |\n@| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |\n@| :- | :- | :- | :- | :-: | :- |\n@| height | number | 是 | - | | 键盘高度 |\n@| value | string | 是 | - | - | 输入框内容 |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/textarea/textarea.uvue) \n ::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/textarea/textarea\n>Template\n```vue\n\n\n