From 30f87e8e76279333a2e79645078b02b0ab0d4f02 Mon Sep 17 00:00:00 2001
From: git_robot <git_robot@dcloud.io>
Date: Mon, 16 Oct 2023 17:39:13 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20utsApiJson.json=E3=80=81ut?=
 =?UTF-8?q?sComJson.json?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/.vuepress/utils/utsApiJson.json | 2 +-
 docs/.vuepress/utils/utsComJson.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/.vuepress/utils/utsApiJson.json b/docs/.vuepress/utils/utsApiJson.json
index 53628dbe0..9bb4f0df4 100644
--- a/docs/.vuepress/utils/utsApiJson.json
+++ b/docs/.vuepress/utils/utsApiJson.json
@@ -1 +1 @@
-{"getApp":{"name":"## getApp() @getapp","description":"\r\n`getApp()` 函数用于获取当前应用实例。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [AppInstance\\<T> & T](#appinstance-values) | \n\n#### AppInstance\\<T> & T 属性值 @appinstance-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| onLaunch | (options?: [OnLaunchOptions](#onlaunchoptions-values)) => void | 否 | - |  生命周期回调 监听应用初始化  应用初始化完成时触发，全局只触发一次。  |\n| onShow | (options?: [OnShowOptions](#onshowoptions-values)) => void | 否 | - |  生命周期回调 监听应用显示  应用启动，或从后台进入前台显示时触发  |\n| onHide | () => void | 否 | - |  生命周期回调 监听应用隐藏  应用从前台进入后台时触发  |\n| onExit | () => void | 否 | - |  监听应用退出。app-uvue-android 3.9+  |\n| onLastPageBackPress | () => void | 否 | - |  最后一个页面按下Android back键，常用于自定义退出。app-uvue-android 3.9+  |\n\n##### OnLaunchOptions 属性值 @onlaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  \t应用启动页面路径 |\n\n##### OnShowOptions 属性值 @onshowoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  \t应用启动页面路径 |\n\n##### AppInstance<T> & T 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| onLaunch | 5.0 | √ | √ | 10.0 | √ | x |\n| onShow | 5.0 | √ | √ | 10.0 | √ | x |\n| onHide | 5.0 | √ | √ | 10.0 | √ | x |\n| onExit | 5.0 | x | √ | x | x | x |\n| onLastPageBackPress | 5.0 | x | √ | x | x | x |\n","compatibility":"","tutorial":"\n### 参见\n[getApp](https://uniapp.dcloud.net.cn/uni-app-x/api/getapp.html#getapp)\n"},"get-app":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app/get-app.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getApp\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text>点击按钮调用 App.uvue methods</text>\n      <text class=\"margin-top:6px;\">increasetLifeCycleNum 方法</text>\n      <button class=\"uni-common-mt\" @click=\"_increasetLifeCycleNum\">\n        increase lifeCycleNum\n      </button>\n      <text class=\"uni-common-mt\">lifeCycleNum: {{ lifeCycleNum }}</text>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nimport { State, state, setLifeCycleNum } from '@/store/index.uts'\n\nexport default {\n  data() {\n    return {\n      lifeCycleNum: 0,\n    }\n  },\n  onReady() {\n    this.lifeCycleNum = state.lifeCycleNum\n  },\n  methods: {\n    _increasetLifeCycleNum: function () {\n      const app = getApp()\n      app.increasetLifeCycleNum()\n      this.lifeCycleNum = state.lifeCycleNum\n    },\n    // 自动化测试\n    setLifeCycleNum(num: number) {\n      setLifeCycleNum(num)\n    },\n  },\n}\n</script>\n\n```"},"getCurrentPages":{"name":"## getCurrentPages() @getcurrentpages","description":"\r\n`getCurrentPages()` 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，数组中的元素为页面实例，第一个元素为首页，最后一个元素为当前页面。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| Array\\<[BasePage](#basepage-values)\\> | \n\n#### BasePage 属性值 @basepage-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| route | string | 是 | - | - |\n| options | Map\\<string, string \\\\| null> | 是 | - | - |\n","compatibility":"","tutorial":"\n### 参见\n[getCurrentPages](https://uniapp.dcloud.net.cn/tutorial/page.html#getcurrentpages)\n"},"get-current-pages":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-current-pages/get-current-pages.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getCurrentPages\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <button @click=\"_getCurrentPages\">getCurrentPages</button>\n      <view v-if=\"pages.length\" style=\"padding: 15px 0px\">\n        <text>当前页面栈中 {{ pages.length }} 个页面，列表如下：</text>\n        <template v-for=\"(page, index) in pages\" :key=\"page.route\">\n          <text style=\"margin-top: 5px\"\n            >index: {{ index }}, route: {{ page.route }}</text\n          >\n        </template>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nclass Page {\n  constructor(public route : string) {\n  }\n}\n\nexport default {\n  data() {\n    return {\n      checked: false,\n      pages: [] as Page[],\n    }\n  },\n  methods: {\n    _getCurrentPages: function () {\n      this.pages.length = 0\n      const pages = getCurrentPages()\n      this.pages.push(new Page(pages[0].route))\n      if (this.pages[0].route.includes('/tabBar/')) {\n        this.checked = true\n      }\n      for (let i = 1; i < pages.length; i++) {\n        this.pages.push(new Page(pages[i].route))\n        if (pages[i].route.includes('/tabBar/')) {\n          this.checked = false\n        }\n      }\n    },\n  },\n}\n</script>\n\n```"},"$on":{"name":"## uni.$on(eventName, callback) @$on","description":"\n监听自定义事件。事件可以由 uni.$emit 触发。回调函数会接收 uni.$emit 传递的参数。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | () => void | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$on](http://uniapp.dcloud.io/api/window/communication?id=on)\n"},"$off":{"name":"## uni.$off(eventName, callback) @$off","description":"\n移除自定义事件监听器。如果没有指定事件名，则移除所有事件监听器。如果提供事件名，则移除该事件的所有监听器。如果提供了事件名和回调，则只移除这个回调的监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | () => void | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$off](http://uniapp.dcloud.io/api/window/communication?id=off)\n"},"$once":{"name":"## uni.$once(eventName, callback) @$once","description":"\n监听一个自定义事件。事件只触发一次，在第一次触发之后移除事件监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | () => void | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$once](http://uniapp.dcloud.io/api/window/communication?id=once)\n"},"$emit":{"name":"## uni.$emit(eventName, args?) @$emit","description":"\n触发自定义事件，附加的参数会传递给事件监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| args | any | 否 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$emit](http://uniapp.dcloud.io/api/window/communication?id=emit)\n"},"event-bus":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/event-bus/event-bus.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <button @click=\"on\">开始监听</button>\r\n      <button @click=\"once\">监听一次</button>\r\n      <button @click=\"off\">取消监听</button>\r\n      <button @click=\"emit\">触发监听</button>\r\n      <button @click=\"clear\">清空消息</button>\r\n      <view class=\"box\">\r\n        <view>收到的消息：</view>\r\n        <view>\r\n          <view v-for=\"(item, index) in log\" :key=\"index\">{{ item }}</view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      log: [] as string[],\r\n    }\r\n  },\r\n  methods: {\r\n    fn(res: string) {\r\n      this.log.push(res)\r\n    },\r\n    on() {\r\n      uni.$on('test', this.fn)\r\n    },\r\n    once() {\r\n      uni.$once('test', this.fn)\r\n    },\r\n    off() {\r\n      uni.$off('test', this.fn)\r\n    },\r\n    emit() {\r\n      uni.$emit('test', 'msg:' + Date.now())\r\n    },\r\n    clear() {\r\n      this.log.length = 0\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.box {\r\n  padding: 10px;\r\n}\r\n</style>\r\n\n```"},"getLaunchOptionsSync":{"name":"## uni.getLaunchOptionsSync() @getlaunchoptionssync","description":"\n获取本次启动时的参数。返回值与App.onLaunch的回调参数一致\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [OnLaunchOptions](#onlaunchoptions-values) | \n\n#### OnLaunchOptions 属性值 @onlaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - | - |\n","compatibility":"","tutorial":"\n### 参见\n[getLaunchOptionsSync](http://uniapp.dcloud.io/api/plugins/getLaunchOptionsSync)\n"},"get-launch-options-sync":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-launch-options-sync/get-launch-options-sync.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getLaunchOptionsSync\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <button @click=\"getLaunchOptionsSync\">getLaunchOptionsSync</button>\n      <view v-if=\"launchOptionsPath.length > 0\" class=\"uni-common-mt\">\n        <text>应用启动路径：</text>\n        <text style=\"margin-top: 5px\">{{ launchOptionsPath }}</text>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nexport default {\n  data() {\n    return {\n      checked: false,\n      homePagePath: '/pages/tabBar/component',\n      launchOptionsPath: '',\n    }\n  },\n  methods: {\n    getLaunchOptionsSync() {\n      const launchOptions = uni.getLaunchOptionsSync()\n      this.launchOptionsPath = launchOptions.path\n      if (launchOptions.path == this.homePagePath) {\n        this.checked = true\n      }\n    },\n  },\n}\n</script>\n\n```"},"exit":{"name":"## uni.exit(options?) @exit","description":"\n退出当前应用","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ExitOptions](#exitoptions-values) | 否 | - | - |\n#### ExitOptions 属性值 @exitoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [ExitSuccess](#exitsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ExitSuccess 属性值 @exitsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"### exit 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 3.8.15 | 3.9.0 | x | x | x |\n","tutorial":"","example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/exit/exit.uvue) \n ```html\n<template>\n\t<view>\n\t\t<button @tap=\"exitAppClick\">退出应用</button>\n\t</view>\n</template>\n\n<script>\n\texport default {\n\t\tmethods: {\n\t\t\texitAppClick:function(){\n\t\t\t\tuni.exit({\n\t\t\t\t\tsuccess:function(res){\n\t\t\t\t\t\tconsole.log(res)\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n\n</style>\n```"},"navigateTo":{"name":"## uni.navigateTo(options) @navigateto","description":"\n保留当前页面，跳转到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [NavigateToOptions](#navigatetooptions-values) | 是 | - | - |\n#### NavigateToOptions 属性值 @navigatetooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### NavigateToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### navigateTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[navigateTo](http://uniapp.dcloud.io/api/router?id=navigateto)\n"},"redirectTo":{"name":"## uni.redirectTo(options) @redirectto","description":"\n关闭当前页面，跳转到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RedirectToOptions](#redirecttooptions-values) | 是 | - | - |\n#### RedirectToOptions 属性值 @redirecttooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### RedirectToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### redirectTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[redirectTo](http://uniapp.dcloud.io/api/router?id=redirectto)\n"},"reLaunch":{"name":"## uni.reLaunch(options) @relaunch","description":"\n关闭所有页面，打开到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ReLaunchOptions](#relaunchoptions-values) | 是 | - | - |\n#### ReLaunchOptions 属性值 @relaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### ReLaunchOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### reLaunch 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[reLaunch](http://uniapp.dcloud.io/api/router?id=relaunch)\n"},"switchTab":{"name":"## uni.switchTab(options) @switchtab","description":"\n跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SwitchTabOptions](#switchtaboptions-values) | 是 | - | - |\n#### SwitchTabOptions 属性值 @switchtaboptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的 tabBar 页面的路径，路径后不能带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SwitchTabOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### switchTab 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[switchTab](http://uniapp.dcloud.io/api/router?id=switchtab)\n"},"navigateBack":{"name":"## uni.navigateBack(options?) @navigateback","description":"\n关闭当前页面，返回上一页面或多级页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [NavigateBackOptions](#navigatebackoptions-values) | 否 | - | - |\n#### NavigateBackOptions 属性值 @navigatebackoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| delta | number | 否 | - |  返回的页面数，如果 delta 大于现有页面数，则返回到首页 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### NavigateBackOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| delta | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### navigateBack 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[navigateBack](http://uniapp.dcloud.io/api/router?id=navigateback)\n"},"navigator":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/navigator/navigator.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head title=\"navigate\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt uni-common-mb\">\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onLoad触发时间戳:</text>\r\n          <text>{{ onLoadTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onShow触发时间戳:</text>\r\n          <text>{{ onShowTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onReady触发时间戳:</text>\r\n          <text>{{ onReadyTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onHide触发时间戳:</text>\r\n          <text>{{ onHideTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onBackPress触发时间戳:</text>\r\n          <text>见控制台</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onUnload触发时间戳:</text>\r\n          <text>见控制台</text>\r\n        </view>\r\n        <view class=\"uni-btn-v\">\r\n          <button @tap=\"navigateTo\" class=\"uni-btn\">\r\n            跳转新页面，并传递数据\r\n          </button>\r\n          <button @tap=\"navigateBack\" class=\"uni-btn\">返回上一页</button>\r\n          <button @tap=\"redirectTo\" class=\"uni-btn\">在当前页面打开</button>\r\n          <button @tap=\"switchTab\" class=\"uni-btn\">切换到模板选项卡</button>\r\n          <button @tap=\"reLaunch\" class=\"uni-btn\">\r\n            关闭所有页面，打开首页\r\n          </button>\r\n          <button @tap=\"navigateToErrorPage\" class=\"uni-btn\">\r\n            打开不存在的页面\r\n          </button>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nimport { State, state, setLifeCycleNum } from '@/store/index.uts'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      onLoadTime: 0,\r\n      onShowTime: 0,\r\n      onReadyTime: 0,\r\n      onHideTime: 0,\r\n    }\r\n  },\r\n  onLoad() {\r\n    this.onLoadTime = Date.now()\r\n    console.log('onLoad', this.onLoadTime)\r\n  },\r\n  onShow() {\r\n    this.onShowTime = Date.now()\r\n    console.log('onShow', this.onShowTime)\r\n  },\r\n  onReady() {\r\n    this.onReadyTime = Date.now()\r\n    console.log('onReady', this.onReadyTime)\r\n  },\r\n  onHide() {\r\n    this.onHideTime = Date.now()\r\n    console.log('onHide', this.onHideTime)\r\n  },\r\n  onBackPress(options: OnBackPressOptions): boolean | null {\r\n    console.log('onBackPress', Date.now())\r\n    console.log('onBackPress from', options.from)\r\n    return null\r\n  },\r\n  onUnload() {\r\n    console.log('onUnload', Date.now())\r\n  },\r\n  methods: {\r\n    reLaunch() {\r\n      uni.reLaunch({\r\n        url: '/pages/tabBar/component',\r\n        success(result) {\r\n          console.log('reLaunch success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('reLaunch fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('reLaunch complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateTo() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=Hello',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateToErrorPage() {\r\n      uni.navigateTo({\r\n        url: '/pages/error-page/error-page',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          uni.showToast({\r\n            title: error.errMsg,\r\n            icon: 'none',\r\n          })\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateToDebounce() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=debounce',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=debounce',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath1() {\r\n      uni.navigateTo({\r\n        url: 'new-page/new-page-1?data=new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath2() {\r\n      uni.navigateTo({\r\n        url: './new-page/new-page-1?data=./new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath3() {\r\n      uni.navigateTo({\r\n        url: '../navigator/new-page/new-page-1?data=../navigator/new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateBack() {\r\n      uni.navigateBack({\r\n        success(result) {\r\n          console.log('navigateBack success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateBack fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateBack complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateBackWithDelta1() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1',\r\n        success() {\r\n          uni.navigateBack({\r\n            delta: 1,\r\n            success(result) {\r\n              console.log('navigateBack success', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n            fail(error) {\r\n              console.log('navigateBack fail', error.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum - 1)\r\n            },\r\n            complete(result) {\r\n              console.log('navigateBack complete', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n          })\r\n        },\r\n      })\r\n    },\r\n    navigateBackWithDelta100() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1',\r\n        success() {\r\n          uni.navigateBack({\r\n            delta: 100,\r\n            success(result) {\r\n              console.log('navigateBack success', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n            fail(error) {\r\n              console.log('navigateBack fail', error.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum - 1)\r\n            },\r\n            complete(result) {\r\n              console.log('navigateBack complete', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n          })\r\n        },\r\n      })\r\n    },\r\n    redirectTo() {\r\n      uni.redirectTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=Hello',\r\n        success(result) {\r\n          console.log('redirectTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('redirectTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('redirectTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    switchTab() {\r\n      uni.switchTab({\r\n        url: '/pages/tabBar/template',\r\n        success(result) {\r\n          console.log('switchTab success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('switchTab fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('switchTab complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    getLifeCycleNum(): number {\r\n      return state.lifeCycleNum\r\n    },\r\n    // 自动化测试\r\n    setLifeCycleNum(num: number) {\r\n      setLifeCycleNum(num)\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.direction-row {\r\n  flex-direction: row;\r\n}\r\n.label {\r\n  width: 190px;\r\n}\r\n</style>\r\n\n```"},"setNavigationBarColor":{"name":"## uni.setNavigationBarColor(options) @setnavigationbarcolor","description":"\n设置导航条、状态栏颜色\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetNavigationBarColorOptions](#setnavigationbarcoloroptions-values) | 是 | - | - |\n#### SetNavigationBarColorOptions 属性值 @setnavigationbarcoloroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| frontColor | #ffffff \\\\| #000000 | 是 | - |  前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 |\n| backgroundColor | string | 是 | - |  背景颜色值，有效值为十六进制颜色 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (error: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetNavigationBarColorOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| frontColor | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### setNavigationBarColor 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[setNavigationBarColor](http://uniapp.dcloud.io/api/ui/navigationbar?id=setnavigationbarcolor)\n"},"set-navigation-bar-color":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/set-navigation-bar-color/set-navigation-bar-color.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"setNavigationBarColor\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <button @tap=\"setNavigationBarColor1\" class=\"uni-btn\">\n        设置导航条背景绿色，标题白色\n      </button>\n      <button @tap=\"setNavigationBarColor2\" class=\"uni-btn\">\n        设置导航条背景红色，标题黑色\n      </button>\n      <button @tap=\"goCustomNavigation\" class=\"uni-btn\">\n        跳转自定义导航栏页面\n      </button>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nimport { state, setLifeCycleNum } from '@/store/index.uts'\n\nexport default {\n  methods: {\n    setNavigationBarColor1() {\n      uni.setNavigationBarColor({\n        frontColor: '#ffffff',\n        backgroundColor: '#00ff00',\n        success() {\n          console.log('setNavigationBarColor success')\n        },\n        fail() {\n          console.log('setNavigationBarColor success')\n        },\n        complete() {\n          console.log('setNavigationBarColor success')\n        }\n      })\n    },\n    setNavigationBarColor2() {\n      uni.setNavigationBarColor({\n        frontColor: '#000000',\n        backgroundColor: '#ff0000',\n        success() {\n          console.log('setNavigationBarColor success')\n        },\n        fail() {\n          console.log('setNavigationBarColor success')\n        },\n        complete() {\n          console.log('setNavigationBarColor success')\n        }\n      })\n    },\n    // 自动化测试\n    getLifeCycleNum(): number {\n      return state.lifeCycleNum\n    },\n    // 自动化测试\n    setLifeCycleNum(num: number) {\n      setLifeCycleNum(num)\n    },\n    goCustomNavigation(){\n      uni.navigateTo({\n        url: '/pages/API/set-navigation-bar-color/set-custom-navigation-bar-color'\n      })\n    }\n  },\n}\n</script>\n\n<style>\n.direction-row {\n  flex-direction: row;\n}\n.label {\n  width: 190px;\n}\n</style>\n\n```"},"setTabBarBadge":{"name":"## uni.setTabBarBadge(options) @settabbarbadge","description":"\n为 tabBar 某一项的右上角添加文本\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarBadgeOptions](#settabbarbadgeoptions-values) | 是 | - | - |\n#### SetTabBarBadgeOptions 属性值 @settabbarbadgeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| text | string | 是 | - |  显示的文本，不超过 3 个半角字符 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarBadge](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbarbadge)\n"},"removeTabBarBadge":{"name":"## uni.removeTabBarBadge(options) @removetabbarbadge","description":"\n移除 tabBar 某一项右上角的文本\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RemoveTabBarBadgeOptions](#removetabbarbadgeoptions-values) | 是 | - | - |\n#### RemoveTabBarBadgeOptions 属性值 @removetabbarbadgeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[removeTabBarBadge](http://uniapp.dcloud.io/api/ui/tabbar?id=removetabbarbadge)\n"},"setTabBarItem":{"name":"## uni.setTabBarItem(options) @settabbaritem","description":"\n动态设置 tabBar 某一项的内容\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarItemOptions](#settabbaritemoptions-values) | 是 | - | - |\n#### SetTabBarItemOptions 属性值 @settabbaritemoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar 的哪一项，从左边算起，索引从0开始 |\n| text | string | 否 | - |  tab 上按钮文字 |\n| iconPath | string | 否 | - |  图片路径 |\n| selectedIconPath | string | 否 | - |  选中时的图片路径 |\n| pagePath | string | 否 | - |  页面绝对路径 |\n| iconfont | [SetTabBarItemIconFontOptions](#settabbaritemiconfontoptions-values) | 否 | - |  字体图标，优先级高于 iconPath |\n| visible | boolean | 否 | - |  tab 是否显示 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### SetTabBarItemIconFontOptions 属性值 @settabbaritemiconfontoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 是 | - |  字库 Unicode 码 |\n| selectedText | string | 是 | - |  选中后字库 Unicode 码 |\n| fontSize | string | 否 | - |  字体图标字号(px) |\n| color | string | 否 | - |  字体图标颜色 |\n| selectedColor | string | 否 | - |  字体图标选中颜色 |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarItem](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbaritem)\n"},"setTabBarStyle":{"name":"## uni.setTabBarStyle(options) @settabbarstyle","description":"\n动态设置 tabBar 的整体样式\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarStyleOptions](#settabbarstyleoptions-values) | 是 | - | - |\n#### SetTabBarStyleOptions 属性值 @settabbarstyleoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| color | string | 否 | - |  tab 上的文字默认颜色 |\n| selectedColor | string | 否 | - |  tab 上的文字选中时的颜色 {HBuilderX.ColorString} |\n| backgroundColor | string | 否 | - |  tab 的背景色 |\n| backgroundImage | string | 否 | - |  图片背景 |\n| backgroundRepeat | string | 否 | - |  背景图平铺方式 |\n| borderStyle | string | 否 | - |  tabbar上边框的颜色 |\n| midButton | [MidButtonOptions](#midbuttonoptions-values) | 否 | - |  tabbar 中间按钮 仅在 list 项为偶数时有效 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### MidButtonOptions 属性值 @midbuttonoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | string | 否 | - |  中间按钮的宽度，tabBar 其它项为减去此宽度后平分，默认值为与其它项平分宽度。默认 80px |\n| height | string | 否 | - |  中间按钮的高度，可以大于 tabBar 高度，达到中间凸起的效果。默认 50px |\n| text | string | 否 | - |  中间按钮的文字 |\n| iconPath | string | 否 | - |  中间按钮的图片路径 |\n| iconWidth | string | 否 | - |  图片宽度（高度等比例缩放）。默认 24px |\n| backgroundImage | string | 否 | - |  中间按钮的背景图片路径 |\n| iconfont | [MidButtonIconFont](#midbuttoniconfont-values) | 否 | - |  字体图标，优先级高于 iconPath |\n\n###### MidButtonIconFont 属性值 @midbuttoniconfont-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 否 | - |  字库 Unicode 码 |\n| selectedText | string | 否 | - |  选中后字库 Unicode 码 |\n| fontSize | string | 否 | - |  字体图标字号(px) |\n| color | string | 否 | - |  字体图标颜色 |\n| selectedColor | string | 否 | - |  字体图标选中颜色 |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarStyle](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbarstyle)\n"},"hideTabBar":{"name":"## uni.hideTabBar(options?) @hidetabbar","description":"\n隐藏 tabBar\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [HideTabBarOptions](#hidetabbaroptions-values) | 否 | - | - |\n#### HideTabBarOptions 属性值 @hidetabbaroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| animation | boolean | 否 | - |  是否需要动画效果 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[hideTabBar](http://uniapp.dcloud.io/api/ui/tabbar?id=hidetabbar)\n"},"showTabBar":{"name":"## uni.showTabBar(options?) @showtabbar","description":"\n显示 tabBar\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowTabBarOptions](#showtabbaroptions-values) | 否 | - | - |\n#### ShowTabBarOptions 属性值 @showtabbaroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| animation | boolean | 否 | - |  是否需要动画效果 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[showTabBar](http://uniapp.dcloud.io/api/ui/tabbar?id=showtabbar)\n"},"showTabBarRedDot":{"name":"## uni.showTabBarRedDot(options) @showtabbarreddot","description":"\n显示 tabBar 某一项的右上角的红点\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowTabBarRedDotOptions](#showtabbarreddotoptions-values) | 是 | - | - |\n#### ShowTabBarRedDotOptions 属性值 @showtabbarreddotoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[showTabBarRedDot](http://uniapp.dcloud.io/api/ui/tabbar?id=showtabbarreddot)\n"},"hideTabBarRedDot":{"name":"## uni.hideTabBarRedDot(options) @hidetabbarreddot","description":"\n隐藏 tabBar 某一项的右上角的红点\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [HideTabBarRedDotOptions](#hidetabbarreddotoptions-values) | 是 | - | - |\n#### HideTabBarRedDotOptions 属性值 @hidetabbarreddotoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[hideTabBarRedDot](http://uniapp.dcloud.io/api/ui/tabbar?id=hidetabbarreddot)\n"},"stopPullDownRefresh":{"name":"## uni.stopPullDownRefresh() @stoppulldownrefresh","description":"\n停止当前页面下拉刷新\n","param":"","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[stopPullDownRefresh](http://uniapp.dcloud.io/api/ui/pulldown?id=stoppulldownrefresh)\n"},"pull-down-refresh":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/pull-down-refresh/pull-down-refresh.uvue) \n ```html\n<template>\n\t<scroll-view>\n\t\t<!-- 实际开发中，长列表应该使用list-view -->\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\n\t\t\t<text class=\"text\" v-for=\"(num,index) in data\" :key=\"index\">list - {{num}}</text>\n\t\t\t<view class=\"uni-loadmore\" v-if=\"showLoadMore\">{{loadMoreText}}</view>\n\t\t</view>\n\t</scroll-view>\n</template>\n<script lang=\"uts\">\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tdata: [] as Array<number>,\n\t\t\t\tloadMoreText: \"加载中...\",\n\t\t\t\tshowLoadMore: false,\n\t\t\t\tmax: 0\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tthis.initData();\n\t\t},\n\t\tonReachBottom() {\n\t\t\tconsole.log(\"onReachBottom\");\n\t\t\tif (this.max > 40) {\n\t\t\t\tthis.loadMoreText = \"没有更多数据了!\"\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.showLoadMore = true;\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.setListData();\n\t\t\t}, 300);\n\t\t},\n\t\tonPullDownRefresh() {\n\t\t\tconsole.log('onPullDownRefresh');\n\t\t\tthis.initData();\n\t\t},\n\t\tmethods: {\n\t\t\tinitData(){\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tthis.max = 0;\n\t\t\t\t\tthis.data = [];\n\t\t\t\t\tlet data:Array<number> = [];\n\t\t\t\t\tthis.max += 20;\n\t\t\t\t\tfor (let i:number = this.max - 19; i < this.max + 1; i++) {\n\t\t\t\t\t\tdata.push(i)\n\t\t\t\t\t}\n\t\t\t\t\tthis.data = this.data.concat(data);\n\t\t\t\t\tuni.stopPullDownRefresh();\n\t\t\t\t}, 300);\n\t\t\t},\n\t\t\tsetListData() {\n\t\t\t\tlet data:Array<number> = [];\n\t\t\t\tthis.max += 10;\n\t\t\t\tfor (let i:number = this.max - 9; i < this.max + 1; i++) {\n\t\t\t\t\tdata.push(i)\n\t\t\t\t}\n\t\t\t\tthis.data = this.data.concat(data);\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n\t.text {\n\t\tmargin: 16rpx 0;\n\t\twidth:100%;\n\t\tbackground-color: #fff;\n\t\theight: 120rpx;\n\t\tline-height: 120rpx;\n\t\ttext-align: center;\n\t\tcolor: #555;\n\t\tborder-radius: 8rpx;\n\t}\n</style>\n\n```"},"pageScrollTo":{"name":"## uni.pageScrollTo(options) @pagescrollto","description":"\n将页面滚动到目标位置\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [PageScrollToOptions](#pagescrolltooptions-values) | 是 | - | - |\n#### PageScrollToOptions 属性值 @pagescrolltooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 否 | - |  滚动到页面的目标位置 |\n| selector | string | 否 | - |  选择器 |\n| offsetTop | number | 否 | - |  偏移距离，可以滚动到 selector 加偏移距离的位置 |\n| duration | number | 否 | - |  滚动动画的时长 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### PageScrollToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| offsetTop | 5.0 | x | 3.91 | 10.0 | x | x |\n","returnValue":"","compatibility":"### pageScrollTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | 3.91 | 10.0 | √ | √ |\n","tutorial":"\n### 参见\n[pageScrollTo](http://uniapp.dcloud.io/api/ui/scroll?id=pagescrollto)\n"},"page-scroll-to":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/page-scroll-to/page-scroll-to.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\" scroll-with-animation=\"true\">\n    <!-- #endif -->\n    <view class=\"uni-padding-wrap\">\n      <page-head :title=\"title\"></page-head>\n      <button type=\"default\" class=\"btn-scrollTo\" @click=\"scrollTo\">\n        scrollTo\n      </button>\n      <button\n        type=\"default\"\n        class=\"btn-scrollToElement\"\n        @click=\"scrollToElement\"\n      >\n        scrollToElement\n      </button>\n      <view class=\"uni-list\" v-for=\"(_, index) in 10\" :key=\"index\">\n        <view class=\"uni-list-cell list-item\">{{ index }}</view>\n      </view>\n      <view class=\"custom-element\">scrollTo-custom-element</view>\n      <view class=\"uni-list\" v-for=\"(_, index2) in 10\" :key=\"index2\">\n        <view class=\"uni-list-cell list-item\">{{ index2 }}</view>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      title: 'pageScrollTo',\n    }\n  },\n  methods: {\n    scrollTo() {\n      uni.pageScrollTo({\n        scrollTop: 100,\n        duration: 300,\n        success: () => {\n          console.log('success')\n        },\n      })\n    },\n    scrollToElement() {\n      uni.pageScrollTo({\n        selector: '.custom-element',\n        duration: 300,\n        success: () => {\n          console.log('success')\n        },\n      })\n    },\n  },\n}\n</script>\n\n<style>\n.list-item {\n  height: 100px;\n  padding-left: 30px;\n}\n</style>\n\n```"},"getElementById":{"name":"## uni.getElementById(id) @getelementbyid","description":"\n返回一个匹配特定 ID 的元素， 如果不存在，返回 null。\\\n如果需要获取指定的节点类型，需要使用 as 进行类型转换。\\\nID 区分大小写，且应该是唯一的。如果存在多个匹配的元素，则返回第一个匹配的元素。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| id | string | 是 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [Element](/uni-app-x/dom/element.md) | 否 | \n","compatibility":"### getElementById 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | x | 3.91 | 10.0 | x | x |\n","tutorial":"\n### 参见\n[getElementById](https://uniapp.dcloud.net.cn/uni-app-x/api/get-element-by-id.html)\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-element-by-id/get-element-by-id.uvue) \n ```html\n<template>\n  <view>\n    <page-head id=\"page-head\" title=\"getElementById\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text id=\"text\">this is text</text>\n      <view id=\"view\" class=\"uni-common-mt\" style=\"border: 1px solid red\"\n        >this is view</view\n      >\n      <button class=\"uni-btn\" @click=\"changePageHeadBackgroundColor\">\n        修改 page-head 背景色\n      </button>\n      <button class=\"uni-btn\" @click=\"changeTextColor\">\n        修改 text 字体颜色\n      </button>\n      <button class=\"uni-btn\" @click=\"changeViewStyle\">\n        修改 view 宽高及背景色\n      </button>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nexport default {\n  data() {\n    return {\n      checked: false,\n      homePagePath: '/pages/tabBar/component',\n      launchOptionsPath: '',\n    }\n  },\n  methods: {\n    getElementByNotExistId(): Element | null {\n      return uni.getElementById('not-exist-id')\n    },\n    changePageHeadBackgroundColor(){\n      const pageHead = uni.getElementById('page-head')!\n      pageHead.style.setProperty('backgroundColor', 'red')\n    },\n    changeTextColor(){\n      const text = uni.getElementById('text')!\n      text.style.setProperty('color', 'red')\n    },\n    changeViewStyle(){\n      const view = uni.getElementById('view')!\n      view.style.setProperty('width', '90%')\n      view.style.setProperty('height', '50px')\n      view.style.setProperty('backgroundColor', '#007AFF')\n    }\n  }\n}\n</script>\n\n```"},"createSelectorQuery":{"name":"## uni.createSelectorQuery() @createselectorquery","description":"\n返回一个SelectorQuery对象实例\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [SelectorQuery](#selectorquery-values) | \n\n#### SelectorQuery 属性值 @selectorquery-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| in | (component?: any) => [SelectorQuery](#selectorquery-values) | 是 | - |  将选择器的选取范围更改为自定义组件component内 |\n| select | (selector: string) => [NodesRef](#nodesref-values) | 是 | - |  在当前页面下选择第一个匹配选择器selector的节点 |\n| selectAll | (selector: string) => [NodesRef](#nodesref-values) | 是 | - |  在当前页面下选择匹配选择器selector的所有节点 |\n| selectViewport | () => [NodesRef](#nodesref-values) | 是 | - |  选择显示区域 |\n| exec | (callback: (result: Array\\<any\\>) => void) => [NodesRef](#nodesref-values) | 是 | - |  执行所有的请求 |\n\n##### NodesRef 属性值 @nodesref-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| boundingClientRect | (callback?: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  添加节点的布局位置的查询请求，相对于显示区域，以像素为单位 |\n| scrollOffset | (callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  添加节点的滚动位置查询请求，以像素为单位 |\n| fields | (fields: [NodeField](#nodefield-values), callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  获取节点的相关信息，需要获取的字段在fields中指定 |\n| node | (callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  获取 Node 节点实例。目前支持 Canvas 的获取。 |\n\n###### NodeField 属性值 @nodefield-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| id | boolean | 否 | - |  是否返回节点 id |\n| dataset | boolean | 否 | - |  是否返回节点 dataset |\n| rect | boolean | 否 | - |  是否返回节点布局位置（left right top bottom） |\n| size | boolean | 否 | - |  是否返回节点尺寸（width height） |\n| scrollOffset | boolean | 否 | - |  是否返回节点的 scrollLeft scrollTop，节点必须是 scroll-view 或者 viewport |\n| properties | Array\\<string\\> | 否 | - |  指定属性名列表，返回节点对应属性名的当前属性值（只能获得组件文档中标注的常规属性值，id class style 和事件绑定的属性值不可获取） |\n| computedStyle | Array\\<string\\> | 否 | - |  指定样式名列表，返回节点对应样式名的当前值 |\n","compatibility":"### createSelectorQuery 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | 3.91 | 10.0 | √ | √ |\n","tutorial":"\n### 参见\n[createSelectorQuery](http://uniapp.dcloud.io/api/ui/nodes-info?id=createselectorquery)\n"},"nodes-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/nodes-info/nodes-info.uvue) \n ```html\n<template>\n  <view class=\"uni-padding-wrap\">\n    <page-head :title=\"title\"></page-head>\n    <button class=\"btn btn-get-node-info\" @click=\"getNodeInfo\">getNodeInfo</button>\n    <button class=\"btn btn-get-all-node-info\" @click=\"getAllNodeInfo\">getAllNodeInfo</button>\n    <view class=\"rect-1-2\">\n      <view class=\"rect rect1\"></view>\n      <view class=\"rect rect2\"></view>\n    </view>\n    <view class=\"rect-info-1-2\">\n      <view class=\"rect-info\" v-for=\"(nodeInfo, index) in nodeInfoList\" :key=\"index\">\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">left: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.left}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">top: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.top}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">right: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.right}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">bottom: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.bottom}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">width: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.width}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">height: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.height}}</text>\n        </view>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n  type NodeInfoType = {\n    left : number | null,\n    top : number | null,\n    right : number | null,\n    bottom : number | null,\n    width : number | null,\n    height : number | null,\n  }\n\n  export default {\n    data() {\n      return {\n        title: 'createSelectorQuery',\n        nodeInfoList: [] as NodeInfoType[],\n      }\n    },\n    methods: {\n      getNodeInfo() {\n        uni.createSelectorQuery().select('.rect1').boundingClientRect().exec((ret) => {\n          this.nodeInfoList.length = 0\n          const i = ret[0] as NodeInfo\n          this.nodeInfoList.push({\n            left: i.left,\n            top: i.top,\n            right: i.right,\n            bottom: i.bottom,\n            width: i.width,\n            height: i.height,\n          } as NodeInfoType)\n        })\n      },\n      getAllNodeInfo() {\n        uni.createSelectorQuery().selectAll('.rect').boundingClientRect().exec((ret) => {\n          this.nodeInfoList.length = 0\n          const array = ret[0] as NodeInfo[]\n          array.forEach((i) => {\n            this.nodeInfoList.push({\n              left: i.left,\n              top: i.top,\n              right: i.right,\n              bottom: i.bottom,\n              width: i.width,\n              height: i.height,\n            } as NodeInfoType)\n          })\n        })\n      }\n    }\n  }\n</script>\n\n<style>\n  .btn {\n    margin-top: 15px;\n  }\n\n  .rect-1-2 {\n    flex-direction: row;\n    margin-top: 15px;\n  }\n\n  .rect {\n    width: 150px;\n    height: 100px;\n  }\n\n  .rect1 {\n    background-color: dodgerblue;\n  }\n\n  .rect2 {\n    margin-left: auto;\n    background-color: seagreen;\n  }\n\n  .rect-info-1-2 {\n    flex-direction: row;\n    margin-top: 15px;\n  }\n\n  .rect-info {\n    flex: 1;\n    flex-direction: column;\n  }\n\n  .node-info-item {\n    flex-direction: row;\n  }\n\n  .node-info-item-k {\n    width: 72px;\n    line-height: 2;\n  }\n\n  .node-info-item-v {\n    font-weight: bold;\n    line-height: 2;\n  }\n</style>\n```"},"showToast":{"name":"## uni.showToast(options) @showtoast","description":"显示消息提示框","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowToastOptions](#showtoastoptions-values) | 是 | - |  uni.showToast参数定义 |\n#### ShowToastOptions 属性值 @showtoastoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 是 | - |  提示的内容，长度与 icon 取值有关。 |\n| icon | string | 否 | - | icon值说明 success: 显示成功图标，error: 显示错误图标； fail: 显示错误图标，此时title文本无长度显示； exception: 显示异常图标，此时title文本无长度显示； loading: 显示加载图标；none: 不显示图标。 |\n| image | string | 否 | - |  自定义图标的本地路径（app端暂不支持gif） |\n| mask | boolean | 否 | - |  是否显示透明蒙层，防止触摸穿透，默认：false |\n| duration | number | 否 | - |  提示的延迟时间，单位毫秒，默认：1500 |\n| position | string | 否 | - | position值说明（仅App生效） top: 居上显示； center: 居中显示；bottom： 居底显示 |\n| success | (res: [ShowToastSuccess](#showtoastsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### showToast 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showToast]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showtoast))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/toast/toast.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast1Tap\">点击弹出默认toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toastTapIconError\">点击弹出设置icon的toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast2Tap\">点击弹出设置duration的toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast3Tap\">点击弹出显示loading的toast</button>\r\n        <!-- #ifndef MP-ALIPAY -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast4Tap\">点击弹出显示自定义图片的toast</button>\r\n        <!-- #endif -->\r\n        <!-- #ifdef APP-PLUS -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast5Tap\">点击显示无图标的居底toast</button>\r\n        <!-- #endif -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"hideToast\">点击隐藏toast</button>\r\n      </view>\r\n      <text>{{exeRet}}</text>\r\n    </view>\r\n  </view>\r\n</template>\r\n<script lang=\"uts\">\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'toast',\r\n        exeRet: ''\r\n      }\r\n    },\r\n    methods: {\r\n      toast1Tap: function () {\r\n        uni.showToast({\r\n          title: \"默认\",\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toastTapIconError: function () {\r\n        uni.showToast({\r\n          title: \"默认\",\r\n          icon: 'error',\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast2Tap: function () {\r\n        uni.showToast({\r\n          title: \"duration 3000\",\r\n          duration: 3000,\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast3Tap: function () {\r\n        uni.showToast({\r\n          title: \"loading\",\r\n          icon: \"loading\",\r\n          duration: 5000,\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast4Tap: function () {\r\n        uni.showToast({\r\n          title: \"logo\",\r\n          image: \"/static/uni.png\",\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      // #ifdef APP-PLUS\r\n      toast5Tap: function () {\r\n        uni.showToast({\r\n          title: \"显示一段轻提示\",\r\n          position: 'bottom',\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      // #endif\r\n      hideToast: function () {\r\n        uni.hideToast()\r\n      }\r\n    }\r\n  }\r\n</script>\n\n```"},"showLoading":{"name":"## uni.showLoading(options) @showloading","description":"显示 loading 提示框, 需主动调用 uni.hideLoading 才能关闭提示框。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowLoadingOptions](#showloadingoptions-values) | 是 | - |  uni.showLoading参数定义 |\n#### ShowLoadingOptions 属性值 @showloadingoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 是 | - |  提示的内容，长度与 icon 取值有关。 |\n| mask | boolean | 否 | - |  是否显示透明蒙层，防止触摸穿透，默认：false |\n| success | (res: [ShowLoadingSuccess](#showloadingsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### showLoading 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showLoading]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showloading))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/loading/loading.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view class=\"uni-list\">\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">是否显示透明蒙层-屏蔽点击事件</view>\n        <switch :checked=\"maskSelect\" @change=\"maskChange\" />\n      </view>\n      <view class=\"uni-padding-wrap\">\n        <view class=\"uni-title uni-common-mt\">\n          <text class=\"uni-title-text\"> 设置标题 </text>\n        </view>\n      </view>\n      <view class=\"uni-list uni-common-pl\">\n        <radio-group @change=\"radioChange\" class=\"radio-group\">\n          <radio class=\"uni-list-cell uni-list-cell-pd radio\" v-for=\"(item, index) in items\" :key=\"item.value\"\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\" :value=\"item.value\"\n            :checked=\"index === current\">\n            {{ item.name }}\n          </radio>\n        </radio-group>\n      </view>\n    </view>\n    <view class=\"uni-padding-wrap\">\n      <view class=\"uni-btn-v\">\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"showLoading\">显示 loading 提示框</button>\n        <!-- #ifndef MP-ALIPAY -->\n        <button class=\"uni-btn-v\" @click=\"hideLoading\">隐藏 loading 提示框</button>\n        <!-- #endif -->\n      </view>\n    </view>\n  </view>\n</template>\n<script lang=\"uts\">\n  type ItemType = {\n    value : string\n    name : string\n  }\n  export default {\n    data() {\n      return {\n        title: 'loading',\n        items: [\n          {\n            value: 'null',\n            name: '无标题',\n          },\n          {\n            value: '三秒后自动关闭',\n            name: '普通标题',\n          },\n          {\n            value: '超长文本内容，测试超出范围-超长文本内容，测试超出范围-三秒后自动关闭',\n            name: '长标题',\n          },\n        ] as ItemType[],\n        current: 0,\n        maskSelect: false,\n        titleSelect: \"null\"\n      }\n    },\n    methods: {\n\n      radioChange(e : RadioGroupChangeEvent) {\n        const selected = this.items.find((item) : boolean => {\n          return item.value == e.detail.value\n        })\n        if (selected != null) {\n          this.titleSelect = selected.value\n        }\n      },\n      maskChange: function (e : SwitchChangeEvent) {\n        this.maskSelect = e.detail.value\n      },\n      showLoading: function () {\n\n        console.log(this.titleSelect)\n        if (this.titleSelect == \"null\") {\n          uni.showLoading({\n            title: \"\",\n            mask: this.maskSelect\n          });\n        } else {\n          uni.showLoading({\n            title: this.titleSelect,\n            mask: this.maskSelect\n          });\n        }\n        // #ifdef MP-ALIPAY\n        this._showTimer && clearTimeout(this._showTimer);\n        this._showTimer = setTimeout(() => {\n          this.hideLoading();\n        }, 3000)\n        // #endif\n        // #ifdef APP-PLUS\n        setTimeout(function () {\n          this.hideLoading();\n        }, 3000);\n        // #endif\n      },\n      hideLoading: function () {\n        uni.hideLoading();\n      }\n    }\n    // #ifdef MP-ALIPAY\n    ,\n    onUnload() {\n      // 页面卸载的时候，手动关闭loading\n      this._showTimer && clearTimeout(this._showTimer);\n    }\n    // #endif\n  }\n</script>\n```"},"showModal":{"name":"## uni.showModal(options) @showmodal","description":"显示模态弹窗，可以只有一个确定按钮，也可以同时有确定和取消按钮。类似于一个API整合了 html 中：alert、confirm。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowModalOptions](#showmodaloptions-values) | 是 | - |  uni.showModal 参数定义 |\n#### ShowModalOptions 属性值 @showmodaloptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 否 | - |  提示的标题 |\n| content | string | 否 | - |  提示的内容 |\n| showCancel | boolean | 否 | true\r\n是否显示取消按钮，默认为 true |  |\n| cancelText | string | 否 | - |  取消按钮的文字，默认为\"取消\" |\n| cancelColor | string | 否 | - |  取消按钮的文字颜色，默认为\"#000000\" |\n| confirmText | string | 否 | - |  确定按钮的文字，默认为\"确定\" |\n| confirmColor | string | 否 | - |  确定按钮的文字颜色 |\n| editable | boolean | 否 | false\r\n是否显示输入框 |  |\n| placeholderText | string | 否 | - |  显示输入框时的提示文本 |\n| success | (res: [ShowModalSuccess](#showmodalsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ShowModalSuccess 属性值 @showmodalsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| confirm | boolean | 是 | - |  为 true 时，表示用户点击了确定按钮 |\n| cancel | boolean | 是 | - |  为 true 时，表示用户点击了取消（用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭） |\n| content | string | 否 | - |  editable 为 true 时，用户输入的文本 |\n","returnValue":"","compatibility":"### showModal 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showModal]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showmodal))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/modal/modal.uvue) \n ```html\n<template>\r\n\t<!-- #ifdef APP -->\r\n\t<scroll-view style=\"flex: 1\">\r\n\t\t<!-- #endif -->\r\n\t\t<view>\r\n\t\t\t<page-head :title=\"title\"></page-head>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<radio-group @change=\"radioChange\">\r\n\t\t\t\t\t<radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\r\n\t\t\t\t\t\t:class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\" :value=\"item.value\"\r\n\t\t\t\t\t\t:checked=\"index === current\">\r\n\t\t\t\t\t\t{{ item.name }}\r\n\t\t\t\t\t</radio>\r\n\t\t\t\t</radio-group>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示取消按钮</view>\r\n\t\t\t\t\t<switch :checked=\"showCancelSelect\" @change=\"showCancelChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制取消文案</view>\r\n\t\t\t\t\t<switch :checked=\"cancelTextSelect\" @change=\"cancelTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制确认文案</view>\r\n\t\t\t\t\t<switch :checked=\"confirmTextSelect\" @change=\"confirmTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示输入框</view>\r\n\t\t\t\t\t<switch :checked=\"editableSelect\" @change=\"editableChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否定制输入提示词</view>\r\n\t\t\t\t\t<switch :checked=\"placeholderTextSelect\" @change=\"placeholderTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button class=\"uni-btn-v\" type=\"default\" @tap=\"modalTap\">\r\n\t\t\t\t\t\tmodal测试\r\n\t\t\t\t\t</button>\r\n\t\t\t\t</view>\r\n\t\t\t\t<text>{{ exeRet }}</text>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t\t<!-- #ifdef APP -->\r\n\t</scroll-view>\r\n\t<!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\n\ttype ItemType = {\r\n\t\tvalue : string,\r\n\t\tname : string,\r\n\t}\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'modal',\r\n\t\t\t\tshowCancelSelect: false,\r\n\t\t\t\tcancelTextSelect: false,\r\n\t\t\t\tconfirmTextSelect: false,\r\n\t\t\t\teditableSelect: false,\r\n\t\t\t\tplaceholderTextSelect: false,\r\n\t\t\t\texeRet: \"\",\r\n\t\t\t\titems: [{\r\n\t\t\t\t\tvalue: '标题',\r\n\t\t\t\t\tname: '有标题'\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: '',\r\n\t\t\t\t\tname: '无标题'\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',\r\n\t\t\t\t\tname: '超长标题'\r\n\t\t\t\t}\r\n\t\t\t\t] as ItemType[],\r\n\t\t\t\tcurrent: 0\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tshowCancelChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.showCancelSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tcancelTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.cancelTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tconfirmTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.confirmTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\teditableChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.editableSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tplaceholderTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.placeholderTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tradioChange(e : RadioGroupChangeEvent) {\r\n\t\t\t\tfor (let i = 0; i < this.items.length; i++) {\r\n\t\t\t\t\tif (this.items[i].value === e.detail.value) {\r\n\t\t\t\t\t\tthis.current = i;\r\n\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tmodalTap: function () {\r\n\t\t\t\tlet cancelTextVal : string\r\n\t\t\t\tlet cancelColorVal = ''\r\n\t\t\t\tif (this.cancelTextSelect) {\r\n\t\t\t\t\tcancelTextVal = \"修改后的取消文本\"\r\n\t\t\t\t\tcancelColorVal = \"#ff00ff\"\r\n\t\t\t\t} else {\r\n\t\t\t\t\tcancelTextVal = \"取消\"\r\n\t\t\t\t}\r\n\r\n\t\t\t\tlet confirmTextVal = '确定'\r\n\t\t\t\tlet confirmColorVal = ''\r\n\t\t\t\tif (this.confirmTextSelect) {\r\n\t\t\t\t\tconfirmTextVal = \"修改后的确定文本\"\r\n\t\t\t\t\tconfirmColorVal = \"#00ffff\"\r\n\t\t\t\t}\r\n\r\n\t\t\t\tlet placeholderTextVal = ''\r\n\t\t\t\tlet contentVal = \"弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内\"\r\n\t\t\t\tif (this.placeholderTextSelect) {\r\n\t\t\t\t\tplaceholderTextVal = \"定制提示信息\"\r\n\t\t\t\t\tcontentVal = \"\"\r\n\t\t\t\t}\r\n\t\t\t\tuni.showModal({\r\n\t\t\t\t\ttitle: this.items[this.current].value,\r\n\t\t\t\t\teditable: this.editableSelect,\r\n\t\t\t\t\tplaceholderText: placeholderTextVal,\r\n\t\t\t\t\tcontent: contentVal,\r\n\t\t\t\t\tshowCancel: this.showCancelSelect,\r\n\t\t\t\t\tcancelText: cancelTextVal,\r\n\t\t\t\t\tcancelColor: cancelColorVal,\r\n\t\t\t\t\tconfirmText: confirmTextVal,\r\n\t\t\t\t\tconfirmColor: confirmColorVal,\r\n\t\t\t\t\tsuccess: function (res) {\r\n\t\t\t\t\t\tthis.exeRet = JSON.stringify(res)\r\n\t\t\t\t\t},\r\n\t\t\t\t\tfail: function (res) {\r\n\t\t\t\t\t\tthis.exeRet = JSON.stringify(res)\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\r\n\t\t\t}\r\n\r\n\t\t}\r\n\t}\r\n</script>\n```"},"showActionSheet":{"name":"## uni.showActionSheet(options) @showactionsheet","description":"从底部向上弹出操作菜单","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowActionSheetOptions](#showactionsheetoptions-values) | 是 | - |  uni.showActionSheet函数参数定义 |\n#### ShowActionSheetOptions 属性值 @showactionsheetoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 否 | - |  菜单标题 |\n| alertText | string | 否 | - |  警示文案（同菜单标题, app无效） |\n| itemList | Array\\<string\\> | 是 | - | - |\n| itemColor | string | 否 | - |  按钮的文字颜色，字符串格式（iOS默认为系统控件颜色） |\n| popover | [Popover](#popover-values) | 否 | - |  大屏设备弹出原生选择按钮框的指示区域，默认居中显示 |\n| success | (res: [ShowActionSheetSuccess](#showactionsheetsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### Popover 属性值 @popover-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| top | number | 是 | - |  指示区域坐标，使用原生 navigationBar 时一般需要加上 navigationBar 的高度 |\n| left | number | 是 | - |  指示区域坐标 |\n| width | number | 是 | - |  指示区域宽度 |\n| height | number | 是 | - |  指示区域高度 |\n\n##### ShowActionSheetSuccess 属性值 @showactionsheetsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tapIndex | number | 否 | - |  用户点击的按钮，从上到下的顺序，从0开始 |\n","returnValue":"","compatibility":"### showActionSheet 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showActionSheet]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/action-sheet/action-sheet.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-list\">\r\n      <radio-group @change=\"radioChange\">\r\n        <radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\r\n          :class=\"index < items.length - 1 ? 'uni-list-cell-line': ''\" :value=\"item.value\" :checked=\"index === current\">\r\n          {{item.name}}\r\n        </radio>\r\n      </radio-group>\r\n    </view>\r\n    <view class=\"uni-list\">\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">自定义itemColor</view>\r\n        <switch :checked=\"itemColorCustom\" @change=\"itemColorChange\" />\r\n      </view>\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">超长文本和空文本item</view>\r\n        <switch :checked=\"itemContentLarge\" @change=\"itemContentLargeChange\" />\r\n      </view>\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">超过6个item</view>\r\n        <switch :checked=\"itemNumLargeSelect\" @change=\"itemNumLargeChange\" />\r\n      </view>\r\n    </view>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"actionSheetTap\">弹出action sheet</button>\r\n      </view>\r\n    </view>\r\n  </view>\r\n</template>\r\n<script lang=\"uts\">\r\n  type ItemType = {\r\n    value : string,\r\n    name : string,\r\n  }\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'action-sheet',\r\n        itemColorCustom: false,\r\n        itemContentLarge: false,\r\n        itemNumLargeSelect: false,\r\n        items: [{\r\n          value: '标题',\r\n          name: '有标题'\r\n        },\r\n        {\r\n          value: '',\r\n          name: '无标题'\r\n        },\r\n        {\r\n          value: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',\r\n          name: '超长标题'\r\n        }\r\n        ] as ItemType[],\r\n        current: 0,\r\n      }\r\n    },\r\n    methods: {\r\n      radioChange(e : RadioGroupChangeEvent) {\r\n        for (let i = 0; i < this.items.length; i++) {\r\n          if (this.items[i].value === e.detail.value) {\r\n            this.current = i;\r\n            break;\r\n          }\r\n        }\r\n      },\r\n      itemContentLargeChange: function (e : SwitchChangeEvent) {\r\n        this.itemContentLarge = e.detail.value\r\n      },\r\n      itemColorChange: function (e : SwitchChangeEvent) {\r\n        this.itemColorCustom = e.detail.value\r\n      },\r\n      itemNumLargeChange: function (e : SwitchChangeEvent) {\r\n        this.itemNumLargeSelect = e.detail.value\r\n      },\r\n      actionSheetTap() {\r\n\r\n        let itemInfo = ['item1', 'item2', 'item3', 'item4']\r\n\r\n        if (this.itemContentLarge) {\r\n          itemInfo = ['两个黄鹂鸣翠柳，一行白鹭上青天。窗含西岭千秋雪，门泊东吴万里船', '水光潋滟晴方好,山色空蒙雨亦奇。 欲把西湖比西子,淡妆浓抹总相宜', '']\r\n        } \n        \n        if (this.itemNumLargeSelect) {\r\n          // 大量选项测试,不能超过6个元素 https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet\r\n          itemInfo = []\n          for (var i = 1; i <= 10; i++) {\r\n            itemInfo.push('两个黄鹂鸣翠柳，一行白鹭上青天');\r\n          }\r\n        }\r\n\r\n        const that = this\r\n        if (this.itemColorCustom) {\r\n          uni.showActionSheet({\r\n            title: this.items[this.current].value,\r\n            itemList: itemInfo,\r\n            itemColor: \"#ff00ff\",\r\n            success: (e) => {\r\n              console.log(e.tapIndex);\r\n              uni.showToast({\r\n                title: \"点击了第\" + e.tapIndex + \"个选项\",\r\n                icon: \"none\"\r\n              })\r\n            },\r\n            fail: (e) => {\r\n              console.log(e);\r\n            }\r\n          })\r\n        } else {\r\n          uni.showActionSheet({\r\n            title: this.items[this.current].value,\r\n            itemList: itemInfo,\r\n            success: (e) => {\r\n              console.log(e.tapIndex);\r\n              uni.showToast({\r\n                title: \"点击了第\" + e.tapIndex + \"个选项\",\r\n                icon: \"none\"\r\n              })\r\n            },\r\n            fail: (e) => {\r\n              console.log(e);\r\n              uni.showToast({\r\n                title: e.errMsg,\r\n                icon: \"none\"\r\n              })\r\n            }\r\n          })\r\n        }\r\n      },\r\n    }\r\n  }\r\n</script>\n\n```"},"loadFontFace":{"name":"## uni.loadFontFace(options) @loadfontface","description":"\n动态加载网络字体\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [LoadFontFaceOptions](#loadfontfaceoptions-values) | 是 | - | - |\n#### LoadFontFaceOptions 属性值 @loadfontfaceoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| global | boolean | 否 | - |  是否全局生效。微信小程序 '2.10.0'起支持全局生效，需在 app.vue 中调用。 |\n| family | string | 是 | - |  定义的字体名称 |\n| source | string | 是 | - |  字体资源的地址 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (error: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### LoadFontFaceOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| global | 5.0 | √ | √ | 10.0 | √ | x |\n| family | 5.0 | √ | √ | 10.0 | √ | x |\n| source | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### loadFontFace 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[loadFontFace](http://uniapp.dcloud.io/api/ui/font?id=loadfontface)\n"},"load-font-face":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/load-font-face/load-font-face.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"loadFontFace\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text class=\"font-size-20\">全局加载字体：</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: UniFontFamily\">font-family: uni.ttf</text>\n      <view style=\"flex-direction: row;\">\n        <text class=\"font-size-20\" style=\"font-family: UniFontFamily;\">{{\n          uniIcon1\n        }}</text>\n        <text style=\"margin-left:5px;margin-right: 20px;line-height:22px;\">\\ue100</text>\n        <text class=\"font-size-20\" style=\"font-family: UniFontFamily;\">{{\n          uniIcon2\n        }}</text>\n        <text style=\"margin-left:5px;line-height:22px;\">\\ue101</text>\n      </view>\n      <text class=\"uni-common-mt font-size-20\">非全局加载字体：</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: AlimamaDaoLiTiTTF\">font-family: 阿里妈妈刀隶体-ttf\n        (网络字体下载后生效)</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: AlimamaDaoLiTiOTF\">font-family:\n        阿里妈妈刀隶体-otf</text>\n      <text class=\"item\" style=\"font-family: AlimamaDaoLiTiWOFF\">font-family: 阿里妈妈刀隶体-woff</text>\n      <text class=\"item\" style=\"font-family: AlimamaDaoLiTiWOFF2\">font-family: 阿里妈妈刀隶体-woff2</text>\n      <button class=\"uni-btn\" @click=\"navigateToChild\">跳转子页面测试字体生效范围</button>\n    </view>\n  </view>\n</template>\n<script>\n  export default {\n    data() {\n      return {\n        uniIcon1: '\\ue100',\n        uniIcon2: '\\ue101',\n      }\n    },\n    onLoad() {\n      uni.loadFontFace({\n        global: true,\n        family: 'UniFontFamily',\n        source: '/static/font/uni.ttf',\n        success() {\n          console.log('global loadFontFace uni.ttf success')\n        },\n        fail(error) {\n          console.warn('global loadFontFace uni.ttf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiTTF',\n        source:\n          'https://native-res.dcloud.net.cn/uni-app-x/static/font/AlimamaDaoLiTi.ttf',\n        success() {\n          console.log('loadFontFace Remote AlimamaDaoLiTi.ttf success')\n        },\n        fail(error) {\n          console.warn('loadFontFace Remote AlimamaDaoLiTi.ttf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiOTF',\n        source: '/static/font/AlimamaDaoLiTi.otf',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.otf success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.otf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiWOFF',\n        source: '/static/font/AlimamaDaoLiTi.woff',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.woff success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.woff fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiWOFF2',\n        source: '/static/font/AlimamaDaoLiTi.woff2',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.woff2 success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.woff2 fail', error.errMsg)\n        },\n      })\n    },\n    methods: {\n      navigateToChild() {\n        uni.navigateTo({\n          url: '/pages/API/load-font-face/load-font-face-child',\n        })\n      },\n    },\n  }\n</script>\n\n<style>\n  .font-size-20 {\n    font-size: 20px;\n  }\n\n  .line-height-40 {\n    line-height: 40px;\n  }\n</style>\n```"},"request":{"name":"## uni.request(param) @request","description":"发起网络请求。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| param | [RequestOptions\\<T>](#requestoptions-values) | 是 | - |  网络请求参数 |\n#### RequestOptions\\<T> 属性值 @requestoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器接口地址 |\n| data | any | 否 | null |  请求的参数 UTSJSONObject\\|string类型 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  设置请求的 header，header 中不能设置 Referer |\n| method | RequestMethod | 否 | \"GET\" |  请求方法 如果设置的值不在取值范围内，会以GET方法进行请求。 |\n| timeout | number | 否 | 60000 |  超时时间，单位 ms |\n| dataType | string | 否 | \"json\" |  如果设为 json，会对返回的数据进行一次 JSON.parse，非 json 不会进行 JSON.parse |\n| responseType | string | 否 | - |  设置响应的数据类型。  |\n| sslVerify | boolean | 否 | - |  验证 ssl 证书  |\n| firstIpv4 | boolean | 否 | false |  DNS解析时优先使用ipv4 |\n| success | (option: [RequestSuccess\\<T>](#requestsuccess-values)) => void | 否 | null |  网络请求成功回调。 |\n| fail | (option: [RequestFail](#requestfail-values)) => void | 否 | null |  网络请求失败回调。 |\n| complete | (option: any) => void | 否 | null |  网络请求完成回调，成功或者失败都会调用。 |\n\n##### RequestSuccess\\<T> 属性值 @requestsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 否 | - |  开发者服务器返回的数据 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n| header | any | 是 | - |  开发者服务器返回的 HTTP Response Header |\n| cookies | Array\\<string\\> | 是 | - | - |\n\n##### RequestFail 属性值 @requestfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [RequestTask](#requesttask-values) | 否 | \n\n#### RequestTask 属性值 @requesttask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断网络请求。 |\n\n##### RequestTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9+ | 9.0 | √ | 3.9+ |\n","compatibility":"### request 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | 3.9+ |\n","tutorial":"\n### 参见\n[request](https://uniapp.dcloud.net.cn/api/request/request.html)\n","example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/request/request.uvue) \n ```html\n<template>\r\n  <view style=\"flex: 1;\">\r\n    <view class=\"uni-padding-wrap uni-common-mt\">\r\n      <view class=\"uni-common-mt\" style=\"border-width: 2rpx;border-radius: 4rpx;\">\r\n        <textarea :value=\"res\" class=\"uni-textarea\"></textarea>\r\n      </view>\r\n      <view>\r\n        <text>地址 : {{ host + url}}</text>\r\n        <text>请求方式 : {{method}}</text>\r\n      </view>\r\n      <view class=\"uni-btn-v uni-common-mt\">\r\n        <button type=\"primary\" @click=\"sendRequest\">发起请求</button>\r\n      </view>\r\n    </view>\r\n    <scroll-view style=\"flex: 1;\" show-scrollbar=\"true\">\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>设置请求方式</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('GET')\">GET</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('POST')\">POST</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('PUT')\">PUT</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('DELETE')\">DELETE</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('PATCH')\">PATCH</button>\r\n          <button style=\"padding: 5rpx;margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('OPTIONS')\">OPTIONS</button>\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" @click=\"changeMethod('HEAD')\">HEAD</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求返回错误码的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in errorCodeUrls\" :key=\"index\"\r\n            @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求不同header的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in headerUrls\" :key=\"index\"\r\n            @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求不同content-type的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in contentTypeUrls\"\r\n            :key=\"index\" @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>POST请求(有body)</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in postUrls\" :key=\"index\"\r\n            @click=\"changeUrlFromPost(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n    </scroll-view>\r\n  </view>\r\n</template>\r\n<script>\r\n  const duration = 2000\r\n  const methodMap = {\r\n    \"GET\": \"/api/http/method/get\",\r\n    \"POST\": \"/api/http/method/post\",\r\n    \"PUT\": \"/api/http/method/put\",\r\n    \"DELETE\": \"/api/http/method/delete\",\r\n    \"PATCH\": \"/api/http/method/patch\",\r\n    \"OPTIONS\": \"/api/http/method/options\",\r\n    \"HEAD\": \"/api/http/method/head\"\r\n  }\r\n\r\n\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'request',\r\n        res: '',\r\n        task: null as RequestTask | null,\r\n        pageVisible: false,\r\n        host: \"http://request.dcloud.net.cn\",\r\n        url: \"/api/http/method/get\",\r\n        method: \"GET\" as RequestMethod | null,\r\n        data: null as any | null,\r\n        header: null as UTSJSONObject | null,\r\n        errorCodeUrls: [\r\n          \"/api/http/statusCode/200\",\r\n          \"/api/http/statusCode/204\",\r\n          \"/api/http/statusCode/301\",\r\n          \"/api/http/statusCode/302\",\r\n          \"/api/http/statusCode/307\",\r\n          \"/api/http/statusCode/400\",\r\n          \"/api/http/statusCode/401\",\r\n          \"/api/http/statusCode/403\",\r\n          \"/api/http/statusCode/404\",\r\n          \"/api/http/statusCode/405\",\r\n          \"/api/http/statusCode/500\",\r\n          \"/api/http/statusCode/502\",\r\n          \"/api/http/statusCode/503\",\r\n          \"/api/http/statusCode/504\",\r\n        ],\r\n        headerUrls: [\r\n          \"/api/http/header/ua\",\r\n          \"/api/http/header/referer\",\r\n          \"/api/http/header/requestCookie\",\r\n          \"/api/http/header/setCookie\",\r\n          \"/api/http/header/deleteCookie\"\r\n        ],\r\n        contentTypeUrls: [\r\n          \"/api/http/contentType/text/plain\",\r\n          \"/api/http/contentType/text/html\",\r\n          \"/api/http/contentType/text/xml\",\r\n          \"/api/http/contentType/image/gif\",\r\n          \"/api/http/contentType/image/jpeg\",\r\n          \"/api/http/contentType/image/png\",\r\n          \"/api/http/contentType/application/json\",\r\n          \"/api/http/contentType/application/octetStream\",\r\n        ],\r\n        postUrls: [\r\n          \"/api/http/contentType/json\",\r\n          \"/api/http/contentType/xWwwFormUrlencoded\",\r\n        ],\r\n        //自动化测试例专用\r\n        jest_result: false\r\n      }\r\n    },\r\n    onLoad() {\r\n      this.pageVisible = true;\r\n    },\r\n    onUnload() {\r\n      this.pageVisible = false;\r\n      uni.hideLoading();\r\n      this.task?.abort();\r\n    },\r\n    methods: {\r\n      changeMethod(e : RequestMethod) {\r\n        this.method = e;\r\n        this.url = methodMap[e] as string;\r\n        this.data = null;\r\n        this.header = null;\r\n      },\r\n      changeUrl(e : string) {\r\n        this.method = \"GET\";\r\n        this.url = e;\r\n        this.data = null;\r\n        this.header = null;\r\n      },\r\n      changeUrlFromPost(e : string) {\r\n        this.method = \"POST\";\r\n        this.url = e;\r\n        switch (e) {\r\n          case \"/api/http/contentType/json\":\r\n            this.header = {\r\n              \"Content-Type\": \"application/json\"\r\n            };\r\n            this.data = {\r\n              \"hello\": \"world\"\r\n            };\r\n            break;\r\n          case \"/api/http/contentType/xWwwFormUrlencoded\":\r\n            this.header = {\r\n              \"Content-Type\": \"application/x-www-form-urlencoded\"\r\n            };\r\n            this.data = \"hello=world\";\r\n            break;\r\n        }\r\n      },\r\n      sendRequest() {\r\n        uni.showLoading({\r\n          title: \"请求中...\"\r\n        })\r\n        this.task = uni.request({\r\n          url: this.host + this.url,\r\n          // dataType: \"json\",\r\n          // responseType: \"json\",\r\n          method: this.method,\r\n          data: this.data,\r\n          header: this.header,\r\n          timeout: 6000,\r\n          sslVerify: false,\r\n          withCredentials: false,\r\n          firstIpv4: false,\r\n          success(res) {\r\n            if (this.pageVisible) {\r\n              console.log('request success', JSON.stringify(res.data))\r\n              uni.showToast({\r\n                title: '请求成功',\r\n                icon: 'success',\r\n                mask: true,\r\n                duration: duration\r\n              });\r\n              this.res = '请求结果 : ' + JSON.stringify(res);\r\n            }\r\n          },\r\n          fail(err) {\r\n            if (this.pageVisible) {\r\n              console.log('request fail', err);\r\n              uni.showModal({\r\n                content: err.errMsg,\r\n                showCancel: false\r\n              });\r\n            }\r\n          },\r\n          complete() {\r\n            uni.hideLoading()\r\n          },\r\n        });\r\n      },\r\n      //自动化测试例专用\r\n      jest_request() {\r\n        uni.request({\r\n          url: this.host + this.url,\r\n          // dataType: \"json\",\r\n          // responseType: \"json\",\r\n          method: this.method,\r\n          data: this.data,\r\n          header: this.header,\r\n          timeout: 6000,\r\n          sslVerify: false,\r\n          withCredentials: false,\r\n          firstIpv4: false,\r\n          success() {\r\n            this.jest_result = true;\r\n          },\r\n          fail() {\r\n            this.jest_result = false;\r\n          },\r\n        });\r\n      }\r\n    }\r\n  }\r\n</script>\n\n```"},"uploadFile":{"name":"## uni.uploadFile(options) @uploadfile","description":"将本地资源上传到开发者服务器。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [UploadFileOptions](#uploadfileoptions-values) | 是 | - | - |\n#### UploadFileOptions 属性值 @uploadfileoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器 url |\n| filePath | string | 否 | null |  要上传文件资源的路径 |\n| name | string | 否 | null |  文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容 |\n| files | Array\\<[UploadFileOptionFiles](#uploadfileoptionfiles-values)\\> | 否 | null |  需要上传的文件列表。 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header, header 中不能设置 Referer |\n| formData | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求中其他额外的 form data |\n| timeout | number | 否 | 120000 |  超时时间，单位 ms |\n| success | (result: [UploadFileSuccess](#uploadfilesuccess-values)) => void | 否 | null |  成功返回的回调函数 |\n| fail | (result: [UploadFileFail](#uploadfilefail-values)) => void | 否 | null |  失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  结束的回调函数（调用成功、失败都会执行） |\n\n##### UploadFileOptionFiles 属性值 @uploadfileoptionfiles-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| name | string | 否 | \"file\" |  multipart 提交时，表单的项目名，默认为 file，如果 name 不填或填的值相同，可能导致服务端读取文件时只能读取到一个文件。 |\n| uri | string | 是 | - |  要上传文件资源的路径 |\n\n##### UploadFileSuccess 属性值 @uploadfilesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | string | 是 | - |  开发者服务器返回的数据 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n\n##### UploadFileFail 属性值 @uploadfilefail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UploadTask](#uploadtask-values) | 否 | \n\n#### UploadTask 属性值 @uploadtask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断上传任务。 |\n| onProgressUpdate | (callback: (result: [OnProgressUpdateResult](#onprogressupdateresult-values)) => void) => void | 是 | - | 监听上传进度变化。 |\n\n##### OnProgressUpdateResult 属性值 @onprogressupdateresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| progress | number | 是 | - |  上传进度百分比 |\n| totalBytesSent | number | 是 | - |  已经上传的数据长度，单位 Bytes |\n| totalBytesExpectedToSend | number | 是 | - |  预期需要上传的数据总长度，单位 Bytes |\n\n##### UploadTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onProgressUpdate | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","compatibility":"### uploadFile 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[uploadFile](https://uniapp.dcloud.net.cn/api/request/network-file.html#uploadfile)\n"},"upload-file":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/upload-file/upload-file.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"demo\">\r\n          <image\r\n            v-if=\"imageSrc\"\r\n            :src=\"imageSrc\"\r\n            class=\"image\"\r\n            mode=\"widthFix\"\r\n          ></image>\r\n          <text v-else class=\"uni-hello-addfile\" @click=\"chooseImage\"\r\n            >+ 选择图片</text\r\n          >\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'uploadFile',\r\n\t\t\timageSrc: '',\r\n\t\t\ttask: null as UploadTask | null,\r\n\t\t\tpageVisible: false,\n      //自动化测试例专用\n      jest_result:false,\r\n\t\t}\r\n\t},\r\n\tonLoad() {\r\n\t\tthis.pageVisible = true;\r\n\t},\r\n\tonUnload() {\r\n\t\tthis.imageSrc = '';\r\n\t\tthis.pageVisible = false;\r\n\t\tuni.hideLoading();\r\n\t\tthis.task?.abort();\r\n\t},\r\n\tmethods: {\r\n\t\tchooseImage: function() {\r\n\t\t\tuni.chooseImage({\r\n\t\t\t\tcount: 1,\r\n\t\t\t\tsizeType: ['compressed'],\r\n\t\t\t\tsourceType: ['album'],\r\n\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\tconsole.log('chooseImage success, temp path is', res.tempFilePaths[0])\r\n\t\t\t\t\tvar imageSrc = res.tempFilePaths[0]\r\n\t\t\t\t\tuni.showLoading({\r\n\t\t\t\t\t\ttitle: '上传中'\r\n\t\t\t\t\t})\n\t\t\t\t\tthis.task = uni.uploadFile({\r\n\t\t\t\t\t\turl: 'https://unidemo.dcloud.net.cn/upload', //仅为示例，非真实的接口地址\r\n\t\t\t\t\t\tfilePath: imageSrc,\r\n\t\t\t\t\t\tname: 'file',\r\n\t\t\t\t\t\tformData: {\r\n\t\t\t\t\t\t\t'user': 'test'\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\t\tconsole.log('uploadImage success, res is:', res)\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t\tuni.showToast({\r\n\t\t\t\t\t\t\t\t\ttitle: '上传成功',\r\n\t\t\t\t\t\t\t\t\ticon: 'success',\r\n\t\t\t\t\t\t\t\t\tduration: 1000\r\n\t\t\t\t\t\t\t\t})\r\n\t\t\t\t\t\t\t\tthis.imageSrc = imageSrc\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t\tfail: (err) => {\r\n\t\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\t\tconsole.log('uploadImage fail', err);\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t\tuni.showModal({\r\n\t\t\t\t\t\t\t\t\tcontent: err.errMsg,\r\n\t\t\t\t\t\t\t\t\tshowCancel: false\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t});\r\n\t\t\t\t},\r\n\t\t\t\tfail: (err) => {\r\n\t\t\t\t\tconsole.log('chooseImage fail', err)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t},\n    //自动化测试例专用\n    jest_uploadFile(){\n      const imageSrc = \"/static/uni.png\";\n      this.task = uni.uploadFile({\n      \turl: 'https://unidemo.dcloud.net.cn/upload', //仅为示例，非真实的接口地址\n      \tfilePath: imageSrc,\n      \tname: 'file',\n      \tformData: {\n      \t\t'user': 'test'\n      \t},\n      \tsuccess: () => {\n          this.jest_result = true;\n      \t},\n      \tfail: () => {\n          this.jest_result = false;\n      \t},\n      })\n    }\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.image {\r\n  width: 100%;\r\n}\r\n\r\n.demo {\r\n  background: #fff;\r\n  padding: 50rpx;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.uni-hello-addfile {\r\n  text-align: center;\r\n  background: #fff;\r\n  padding: 50rpx;\r\n  margin-top: 10px;\r\n  font-size: 38rpx;\r\n  color: #808080;\r\n}\r\n</style>\r\n\n```"},"downloadFile":{"name":"## uni.downloadFile(options) @downloadfile","description":"下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [DownloadFileOptions](#downloadfileoptions-values) | 是 | - | - |\n#### DownloadFileOptions 属性值 @downloadfileoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  下载资源的 url |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header，header 中不能设置 Referer |\n| filePath | string | 否 | null |  指定文件下载路径 支持相对路径与绝对路径，例： `/imgs/pic.png`、`/storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/temp/imgs/pic.png` 并且支持指定下载目录，例： `/imgs/` |\n| timeout | number | 否 | 120000 |  超时时间，单位 ms |\n| success | (result: [DownloadFileSuccess](#downloadfilesuccess-values)) => void | 否 | null |  下载成功后以 tempFilePath 的形式传给页面，res = {tempFilePath: '文件的临时路径'} |\n| fail | (result: [DownloadFileFail](#downloadfilefail-values)) => void | 否 | null |  失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  结束的回调函数（调用成功、失败都会执行） |\n\n##### DownloadFileSuccess 属性值 @downloadfilesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tempFilePath | string | 是 | - |  临时文件路径，下载后的文件会存储到一个临时文件 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n\n##### DownloadFileFail 属性值 @downloadfilefail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [DownloadTask](#downloadtask-values) | 否 | \n\n#### DownloadTask 属性值 @downloadtask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断下载任务。 |\n| onProgressUpdate | (callback: (result: [OnProgressDownloadResult](#onprogressdownloadresult-values)) => void) => void | 是 | - | 监听下载进度变化。 |\n\n##### OnProgressDownloadResult 属性值 @onprogressdownloadresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| progress | number | 是 | - |  下载进度百分比 |\n| totalBytesWritten | number | 是 | - |  已经下载的数据长度，单位 Bytes |\n| totalBytesExpectedToWrite | number | 是 | - |  预期需要下载的数据总长度，单位 Bytes |\n\n##### DownloadTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onProgressUpdate | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","compatibility":"### downloadFile 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[downloadFile](https://uniapp.dcloud.net.cn/api/request/network-file.html#downloadfile)\n"},"download-file":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/download-file/download-file.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view v-if=\"imageSrc\" class=\"image-container\">\r\n          <image class=\"img\" :src=\"imageSrc\" mode=\"center\" />\r\n        </view>\r\n        <view v-else style=\"margin-top: 50px\">\r\n          <text class=\"uni-hello-text\">点击按钮下载服务端示例图片（下载网络文件到本地临时目录）</text>\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"downloadImage\">下载</button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'downloadFile',\r\n\t\t\timageSrc: '',\r\n\t\t\ttask: null as DownloadTask | null,\r\n\t\t\tpageVisible: false,\n      //自动化测试例专用\n      jest_result: false\r\n\t\t}\r\n\t},\r\n\tonLoad() {\r\n\t\tthis.pageVisible = true;\r\n\t},\r\n\tonUnload() {\r\n\t\tthis.imageSrc = '';\r\n\t\tthis.pageVisible = false;\r\n\t\tuni.hideLoading();\r\n\t\tthis.task?.abort();\r\n\t},\r\n\tmethods: {\r\n\t\tdownloadImage: function() {\r\n\t\t\tuni.showLoading({\r\n\t\t\t\ttitle: '下载中'\r\n\t\t\t})\r\n\t\t\tvar self = this\r\n\t\t\tthis.task = uni.downloadFile({\r\n\t\t\t\turl: \"https://web-assets.dcloud.net.cn/unidoc/zh/uni-app.png\",\r\n\t\t\t\tsuccess(res) {\r\n\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\tconsole.log('downloadFile success, res is', res)\r\n\t\t\t\t\t\tself.imageSrc = res.tempFilePath;\r\n\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\tfail: (err) => {\r\n\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\tconsole.log('downloadFile fail, err is:', err)\r\n\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t\tthis.task?.onProgressUpdate((update) => {\r\n\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\tconsole.log(\"progress : \", update.progress);\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t},\n    //自动化测试例专用\n    jest_downloadFile(){\n      uni.downloadFile({\n      \turl: \"https://web-assets.dcloud.net.cn/unidoc/zh/uni-app.png\",\n      \tsuccess() {\n          this.jest_result = true\n      \t},\n      \tfail: () => {\n          this.jest_result = false\n      \t}\n      });\r\n    }\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.img {\r\n  width: 500rpx;\r\n  height: 500rpx;\r\n  margin: 0 auto;\r\n}\r\n\r\n.image-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n</style>\r\n\n```"},"getNetworkType":{"name":"## uni.getNetworkType(options) @getnetworktype","description":"获取网络类型","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetNetworkTypeOptions](#getnetworktypeoptions-values) | 是 | - | - |\n#### GetNetworkTypeOptions 属性值 @getnetworktypeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [GetNetworkTypeSuccess](#getnetworktypesuccess-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetNetworkTypeSuccess 属性值 @getnetworktypesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| networkType | string | 是 | - |  网络类型 |\n","returnValue":"","compatibility":"### getNetworkType 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getNetworkType](http://uniapp.dcloud.io/api/system/network?id=getnetworktype)\n"},"get-network-type":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-network-type/get-network-type.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t<view style=\"background:#FFFFFF; padding:40rpx;\">\r\n\t\t\t\t<view class=\"uni-center\">网络状态</view>\r\n\t\t\t\t<view v-if=\"hasNetworkType == false\">\r\n\t\t\t\t\t<view class=\"uni-h2 uni-center uni-common-mt\">未获取</view>\r\n\t\t\t\t\t<view class=\"uni-center uni-common-mt\">请点击下面按钮获取网络状态</view>\r\n\t\t\t\t</view>\r\n\t\t\t\t<view v-if=\"hasNetworkType == true\">\r\n\t\t\t\t\t<view class=\"uni-h2 uni-center uni-common-mt\">{{networkType}}</view>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v uni-common-mt\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"getNetworkType\">获取设备网络状态</button>\r\n\t\t\t\t<button class=\"uni-common-mt\" @tap=\"clear\">清空</button>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getNetworkType',\r\n\t\t\t\thasNetworkType: false,\r\n\t\t\t\tnetworkType: '',\r\n\t\t\t\tconnectedWifi: '',\r\n\t\t\t\tpageVisible: false,\n        //自动化测试例专用\n        jest_result:false,\r\n\t\t\t}\r\n\t\t},\r\n\t\tonLoad() {\r\n\t\t\tthis.pageVisible = true;\r\n\t\t},\r\n\t\tonUnload: function() {\r\n\t\t\tthis.pageVisible = false;\r\n\t\t\tthis.networkType = '';\r\n\t\t\tthis.hasNetworkType = false;\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetNetworkType: function() {\r\n\t\t\t\tuni.getNetworkType({\r\n\t\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\t\tconsole.log(res)\r\n\t\t\t\t\t\tthis.hasNetworkType = true;\r\n\t\t\t\t\t\tthis.networkType = res.networkType\r\n\t\t\t\t\t},\r\n\t\t\t\t\tfail: () => {\r\n\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\tuni.showModal({\r\n\t\t\t\t\t\t\t\tcontent: '获取失败！',\r\n\t\t\t\t\t\t\t\tshowCancel: false\r\n\t\t\t\t\t\t\t})\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\t\t\t},\r\n\t\t\tclear: function() {\r\n\t\t\t\tthis.hasNetworkType = false;\r\n\t\t\t\tthis.networkType = '';\r\n\t\t\t\tthis.connectedWifi = '';\r\n\t\t\t},\n      //自动化测试例专用\n      jest_getNetworkType(){\n        uni.getNetworkType({\n        \tsuccess: () => {\n            this.jest_result = true;\n        \t},\n        \tfail: () => {\n            this.jest_result = false;\n        \t}\n        })\n      }\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\r\n</style>\n\n```"},"connectSocket":{"name":"## uni.connectSocket(options) @connectsocket","description":"创建一个 WebSocket 连接。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ConnectSocketOptions](#connectsocketoptions-values) | 是 | - | - |\n#### ConnectSocketOptions 属性值 @connectsocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器接口地址，必须是 wss 协议，且域名必须是后台配置的合法域名 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header，header 中不能设置 Referer |\n| protocols | Array\\<string\\> | 否 | null |  子协议数组 |\n| success | (result: [ConnectSocketSuccess](#connectsocketsuccess-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [ConnectSocketFail](#connectsocketfail-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ConnectSocketSuccess 属性值 @connectsocketsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### ConnectSocketFail 属性值 @connectsocketfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | 600009 | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [SocketTask](#sockettask-values) | \n\n#### SocketTask 属性值 @sockettask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| send | (options: [SendSocketMessageOptions](#sendsocketmessageoptions-values)) => void | 是 | - | 通过 WebSocket 连接发送数据 |\n| close | (options: [CloseSocketOptions](#closesocketoptions-values)) => void | 是 | - | 关闭 WebSocket 连接 |\n| onOpen | (callback: (result: [OnSocketOpenCallbackResult](#onsocketopencallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 连接打开事件 |\n| onClose | (callback: (result: any) => void) => void | 是 | - | 监听 WebSocket 连接关闭事件 |\n| onError | (callback: (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 错误 |\n| onMessage | (callback: (result: [OnSocketMessageCallbackResult](#onsocketmessagecallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 接受到服务器的消息事件 |\n\n##### SendSocketMessageOptions 属性值 @sendsocketmessageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  需要发送的内容 |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### CloseSocketOptions 属性值 @closesocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 否 | 1000 |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。如果这个参数没有被指定，默认的取值是1000 （表示正常连接关闭） |\n| reason | string | 否 | \"\" |  一个可读的字符串，表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本（不是字符） |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### OnSocketOpenCallbackResult 属性值 @onsocketopencallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| header | any | 是 | - |  连接成功的 HTTP 响应 Header |\n\n##### OnSocketMessageCallbackResult 属性值 @onsocketmessagecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  服务器返回的消息 |\n\n##### SocketTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| send | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| close | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onOpen | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onClose | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onError | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n| onMessage | 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","compatibility":"### connectSocket 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[connectSocket](https://uniapp.dcloud.net.cn/api/request/websocket.html#connectsocket)\n"},"onSocketOpen":{"name":"## uni.onSocketOpen(options) @onsocketopen","description":"监听WebSocket连接打开事件。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | (result: [OnSocketOpenCallbackResult](#onsocketopencallbackresult-values)) => void | 是 | - | - |","returnValue":"","compatibility":"### onSocketOpen 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketOpen](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketopen)\n"},"onSocketError":{"name":"## uni.onSocketError(callback) @onsocketerror","description":"下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketErrorCallbackResult](#onsocketerrorcallbackresult-values)) => void | 是 | - | - |\n#### OnSocketErrorCallbackResult 属性值 @onsocketerrorcallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n","returnValue":"","compatibility":"### onSocketError 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketError](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketerror)\n"},"sendSocketMessage":{"name":"## uni.sendSocketMessage(options) @sendsocketmessage","description":"通过 WebSocket 连接发送数据，需要先 uni.connectSocket，并在 uni.onSocketOpen 回调之后才能发送。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SendSocketMessageOptions](#sendsocketmessageoptions-values) | 是 | - | - |\n#### SendSocketMessageOptions 属性值 @sendsocketmessageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  需要发送的内容 |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### sendSocketMessage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[sendSocketMessage](https://uniapp.dcloud.net.cn/api/request/websocket.html#sendsocketmessage)\n"},"onSocketMessage":{"name":"## uni.onSocketMessage(callback) @onsocketmessage","description":"监听WebSocket接受到服务器的消息事件。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketMessageCallbackResult](#onsocketmessagecallbackresult-values)) => void | 是 | - | - |\n#### OnSocketMessageCallbackResult 属性值 @onsocketmessagecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  服务器返回的消息 |\n","returnValue":"","compatibility":"### onSocketMessage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketMessage](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketmessage)\n"},"closeSocket":{"name":"## uni.closeSocket(options) @closesocket","description":"关闭 WebSocket 连接。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [CloseSocketOptions](#closesocketoptions-values) | 是 | - | - |\n#### CloseSocketOptions 属性值 @closesocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 否 | 1000 |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。如果这个参数没有被指定，默认的取值是1000 （表示正常连接关闭） |\n| reason | string | 否 | \"\" |  一个可读的字符串，表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本（不是字符） |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### closeSocket 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[closeSocket](https://uniapp.dcloud.net.cn/api/request/websocket.html#closesocket)\n"},"onSocketClose":{"name":"## uni.onSocketClose(callback) @onsocketclose","description":"监听WebSocket关闭。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketCloseCallbackResult](#onsocketclosecallbackresult-values)) => void | 是 | - | - |\n#### OnSocketCloseCallbackResult 属性值 @onsocketclosecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 是 | - |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。\t |\n| reason | string | 是 | - |  一个可读的字符串，表示连接被关闭的原因。\t |\n","returnValue":"","compatibility":"### onSocketClose 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketClose](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketclose)\n"},"websocket-global":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/websocket-global/websocket-global.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head title=\"websocket通讯示例\"></page-head>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <text class=\"websocket-msg\">{{ showMsg }}</text>\r\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"connect\">\r\n          连接websocket服务\r\n        </button>\r\n        <button\r\n          class=\"uni-btn-v\"\r\n          v-show=\"connected\"\r\n          type=\"primary\"\r\n          @click=\"send\"\r\n        >\r\n          发送一条消息\r\n        </button>\r\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"close\">\r\n          断开websocket服务\r\n        </button>\r\n        <text class=\"websocket-tips\"\r\n          >发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</text\r\n        >\r\n      </view>\r\n    </view>\r\n  </view>\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      connected: false,\r\n      connecting: false,\r\n      msg: '',\r\n      roomId: '',\r\n      platform: '',\r\n      pageVisible: false,\r\n    }\r\n  },\r\n  computed: {\r\n    showMsg(): string {\r\n      if (this.connected) {\r\n        if (this.msg.length > 0) {\r\n          return '收到消息：' + this.msg\r\n        } else {\r\n          return '等待接收消息'\r\n        }\r\n      } else {\r\n        return '尚未连接'\r\n      }\r\n    },\r\n  },\r\n  onLoad() {\r\n    this.platform = uni.getSystemInfoSync().platform\r\n    this.pageVisible = true\r\n  },\r\n  onUnload() {\r\n    this.pageVisible = false\r\n    uni.closeSocket({\r\n      code: 1000,\r\n      reason: 'close reason from client',\r\n      success(res: any) {\r\n        console.log('uni.closeSocket success', res)\r\n      },\r\n      fail(err: any) {\r\n        console.log('uni.closeSocket fail', err)\r\n      },\r\n    } as CloseSocketOptions)\r\n    uni.hideLoading()\r\n  },\r\n  methods: {\r\n    connect() {\r\n      if (this.connected || this.connecting) {\r\n        uni.showModal({\r\n          content: '正在连接或者已经连接，请勿重复连接',\r\n          showCancel: false,\r\n        })\r\n        return\r\n      }\r\n      this.connecting = true\r\n      uni.showLoading({\r\n        title: '连接中...',\r\n      })\r\n      uni.connectSocket({\r\n        url: 'ws://websocket.dcloud.net.cn',\r\n        success(res: any) {\r\n          // 这里是接口调用成功的回调，不是连接成功的回调，请注意\r\n          console.log('uni.connectSocket success', res)\r\n        },\r\n        fail(err: any) {\r\n          // 这里是接口调用失败的回调，不是连接失败的回调，请注意\r\n          console.log('uni.connectSocket fail', err)\r\n        },\r\n      })\r\n      uni.onSocketOpen((res) => {\r\n        if (this.pageVisible) {\r\n          this.connecting = false\r\n          this.connected = true\r\n          uni.hideLoading()\r\n\r\n          uni.showToast({\r\n            icon: 'none',\r\n            title: '连接成功',\r\n          })\r\n          console.log('onOpen', res)\r\n        }\r\n      })\r\n      uni.onSocketError((err) => {\r\n        if (this.pageVisible) {\r\n          this.connecting = false\r\n          this.connected = false\r\n          uni.hideLoading()\r\n\r\n          uni.showModal({\r\n            content: '连接失败，可能是websocket服务不可用，请稍后再试',\r\n            showCancel: false,\r\n          })\r\n          console.log('onError', err)\r\n        }\r\n      })\r\n      uni.onSocketMessage((res) => {\r\n        if (this.pageVisible) {\r\n          this.msg = res.data as string\r\n          console.log('onMessage', res)\r\n        }\r\n      })\r\n      uni.onSocketClose((res) => {\r\n        if (this.pageVisible) {\r\n          this.connected = false\r\n          this.msg = ''\r\n          console.log('onClose', res)\r\n        }\r\n      })\r\n    },\r\n    send() {\r\n      uni.sendSocketMessage({\r\n        data:\r\n          'from ' +\r\n          this.platform +\r\n          ' : ' +\r\n          parseInt((Math.random() * 10000).toString()).toString(),\r\n        success(res: any) {\r\n          console.log(res)\r\n        },\r\n        fail(err: any) {\r\n          console.log(err)\r\n        },\r\n      } as SendSocketMessageOptions)\r\n    },\r\n    close() {\r\n      uni.closeSocket({\r\n        code: 1000,\r\n        reason: 'close reason from client',\r\n        success(res: any) {\r\n          console.log('uni.closeSocket success', res)\r\n        },\r\n        fail(err: any) {\r\n          console.log('uni.closeSocket fail', err)\r\n        },\r\n      } as CloseSocketOptions)\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-btn-v {\r\n  padding: 10rpx 0;\r\n}\r\n\r\n.uni-btn-v {\r\n  margin: 20rpx 0;\r\n}\r\n\r\n.websocket-room {\r\n  height: 40px;\r\n  line-height: 40px;\r\n  text-align: center;\r\n  border-bottom: solid 1px #dddddd;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.websocket-msg {\r\n  padding: 40px 0px;\r\n  text-align: center;\r\n  font-size: 14px;\r\n  line-height: 40px;\r\n  color: #666666;\r\n}\r\n\r\n.websocket-tips {\r\n  padding: 40px 0px;\r\n  text-align: center;\r\n  font-size: 14px;\r\n  line-height: 24px;\r\n  color: #666666;\r\n}\r\n</style>\r\n\n```"},"getSystemInfo":{"name":"## uni.getSystemInfo(options) @getsysteminfo","description":"异步获取系统信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetSystemInfoOptions](#getsysteminfooptions-values) | 是 | - | - |\n#### GetSystemInfoOptions 属性值 @getsysteminfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [GetSystemInfoResult](#getsysteminforesult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetSystemInfoResult 属性值 @getsysteminforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| SDKVersion | string | 是 | - |  客户端基础库版本 |\n| appId | string | 是 | - |  `manifest.json` 中应用appid。 |\n| appLanguage | string | 是 | - |  应用设置的语言。 |\n| appName | string | 是 | - |  `manifest.json` 中应用名称。 |\n| appVersion | string | 是 | - |  `manifest.json` 中应用版本名称。 |\n| appVersionCode | string | 是 | - |  `manifest.json` 中应用版本名号。 |\n| brand | string | 是 | - |  手机品牌。 |\n| browserName | string | 是 | - |  浏览器名称。`App` 端是系统 webview 的名字，比如 wkwebview、chrome。小程序端为空 |\n| browserVersion | string | 是 | - |  浏览器版本、webview 版本。 |\n| deviceId | string | 是 | - |  设备 ID |\n| deviceBrand | string | 是 | - |  设备品牌。如：`apple`、`huawei`。 |\n| deviceModel | string | 是 | - |  设备型号 |\n| deviceType | string | 是 | - |  设备类型。`phone`、`pad`、`pc` |\n| devicePixelRatio | number | 是 | - |  设备像素比 |\n| deviceOrientation | string | 是 | - |  设备方向。如：`竖屏 portrait`、`横屏 landscape` - portrait: 竖屏 - landscape: 横屏 |\n| language | string | 是 | - |  程序设置的语言 |\n| model | string | 是 | - |  手机型号 |\n| osName | string | 是 | - |  ios、android、windows、mac、linux |\n| osVersion | string | 是 | - |  操作系统版本。如 ios 版本，andriod 版本 |\n| osLanguage | string | 是 | - |  操作系统语言 |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| platform | string | 是 | - |  客户端平台 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| system | string | 是 | - |  操作系统版本 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| ua | string | 是 | - |  用户标识。小程序端为空 |\n| uniCompileVersion | string | 是 | - |  uni 编译器版本 |\n| uniPlatform | string | 是 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 是 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 是 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 是 | - |  uni 运行时版本号 |\n| version | string | 是 | - |  引擎版本号。已废弃，仅为了向下兼容保留  |\n| romName | string | 是 | - |  rom 名称。Android 部分机型获取不到值。iOS 恒为 `ios` |\n| romVersion | string | 是 | - |  rom 版本号。Android 部分机型获取不到值。iOS 恒为 `ios 版本号` |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| oaid | string | 否 | - |  oaid  |\n| osAndroidAPILevel | number | 否 | - |  Android 系统API库的版本。  |\n\n###### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n###### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n\n###### GetSystemInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 4.4 | √ | √ | x | x | x |\n| osAndroidAPILevel | 4.4 | √ | √ | x | x | x |\n","returnValue":"","compatibility":"### getSystemInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getSystemInfo](http://uniapp.dcloud.io/api/system/info?id=getsysteminfo)\n"},"getSystemInfoSync":{"name":"## uni.getSystemInfoSync() @getsysteminfosync","description":"同步获取系统信息","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetSystemInfoResult](#getsysteminforesult-values) | \n\n#### GetSystemInfoResult 属性值 @getsysteminforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| SDKVersion | string | 是 | - |  客户端基础库版本 |\n| appId | string | 是 | - |  `manifest.json` 中应用appid。 |\n| appLanguage | string | 是 | - |  应用设置的语言。 |\n| appName | string | 是 | - |  `manifest.json` 中应用名称。 |\n| appVersion | string | 是 | - |  `manifest.json` 中应用版本名称。 |\n| appVersionCode | string | 是 | - |  `manifest.json` 中应用版本名号。 |\n| brand | string | 是 | - |  手机品牌。 |\n| browserName | string | 是 | - |  浏览器名称。`App` 端是系统 webview 的名字，比如 wkwebview、chrome。小程序端为空 |\n| browserVersion | string | 是 | - |  浏览器版本、webview 版本。 |\n| deviceId | string | 是 | - |  设备 ID |\n| deviceBrand | string | 是 | - |  设备品牌。如：`apple`、`huawei`。 |\n| deviceModel | string | 是 | - |  设备型号 |\n| deviceType | string | 是 | - |  设备类型。`phone`、`pad`、`pc` |\n| devicePixelRatio | number | 是 | - |  设备像素比 |\n| deviceOrientation | string | 是 | - |  设备方向。如：`竖屏 portrait`、`横屏 landscape` - portrait: 竖屏 - landscape: 横屏 |\n| language | string | 是 | - |  程序设置的语言 |\n| model | string | 是 | - |  手机型号 |\n| osName | string | 是 | - |  ios、android、windows、mac、linux |\n| osVersion | string | 是 | - |  操作系统版本。如 ios 版本，andriod 版本 |\n| osLanguage | string | 是 | - |  操作系统语言 |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| platform | string | 是 | - |  客户端平台 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| system | string | 是 | - |  操作系统版本 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| ua | string | 是 | - |  用户标识。小程序端为空 |\n| uniCompileVersion | string | 是 | - |  uni 编译器版本 |\n| uniPlatform | string | 是 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 是 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 是 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 是 | - |  uni 运行时版本号 |\n| version | string | 是 | - |  引擎版本号。已废弃，仅为了向下兼容保留  |\n| romName | string | 是 | - |  rom 名称。Android 部分机型获取不到值。iOS 恒为 `ios` |\n| romVersion | string | 是 | - |  rom 版本号。Android 部分机型获取不到值。iOS 恒为 `ios 版本号` |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| oaid | string | 否 | - |  oaid  |\n| osAndroidAPILevel | number | 否 | - |  Android 系统API库的版本。  |\n\n##### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n##### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n\n##### GetSystemInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 4.4 | √ | √ | x | x | x |\n| osAndroidAPILevel | 4.4 | √ | √ | x | x | x |\n","compatibility":"### getSystemInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getSystemInfoSync](http://uniapp.dcloud.io/api/system/info?id=getsysteminfosync)\n"},"get-system-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-system-info/get-system-info.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view\r\n            class=\"uni-list-cell\"\r\n            v-for=\"(item, _) in items\"\r\n            style=\"align-items: center\"\r\n          >\r\n            <view class=\"uni-pd\">\r\n              <view class=\"uni-label\" style=\"width: 180px\">{{\r\n                item.label\r\n              }}</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <textarea\r\n                :auto-height=\"true\"\r\n                :disabled=\"true\"\r\n                placeholder=\"未获取\"\r\n                :value=\"item.value\"\r\n              />\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"getSystemInfoSync\">\r\n              同步获取设备系统信息\r\n            </button>\n            <button type=\"primary\" @tap=\"getSystemInfo\" style=\"margin-top: 20px;\">\n              异步获取设备系统信息\n            </button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\ntype Item = {\r\n\tlabel : string,\r\n\tvalue : string,\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'getSystemInfo',\r\n\t\t\titems: [] as Item[],\r\n\t\t}\r\n\t},\r\n\tonUnload: function () {\r\n\t},\r\n\tmethods: {\r\n\t\tgetSystemInfo: function () {\n\t\t\tuni.getSystemInfo({\r\n\t\t\t\tsuccess: (res) => {\n          this.items = [] as Item[];\n          for(const key in res){\n            const value = res[key];\n            if(value != null){\n              const item = {\n              \tlabel: key,\n              \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n              } as Item;\n              this.items.push(item);\n            }\n          }\n\t\t\t\t},\r\n\t\t\t})\r\n\t\t},\n    getSystemInfoSync: function () {\n      this.items = [] as Item[];\n      const res = uni.getSystemInfoSync()\n    \tfor(const key in res){\n    \t  const value = res[key];\n    \t  if(value != null){\n    \t    const item = {\n    \t    \tlabel: key,\n    \t    \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n    \t    } as Item;\n    \t    this.items.push(item);\n    \t  }\n    \t}\n    },\n    //自动化测试例专用\n    jest_getSystemInfo():GetSystemInfoResult{\n      return uni.getSystemInfoSync();\n    },\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-pd {\r\n  padding-left: 30rpx;\r\n}\r\n</style>\r\n\n```"},"getDeviceInfo":{"name":"## uni.getDeviceInfo(options?) @getdeviceinfo","description":"获取设备信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetDeviceInfoOptions](#getdeviceinfooptions-values) | 否 | 包含所有字段的过滤对象 | [options=包含所有字段的过滤对象\\] 过滤的字段对象, 不传参数默认为获取全部字段。 |\n#### GetDeviceInfoOptions 属性值 @getdeviceinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filter | Array\\<string\\> | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetDeviceInfoResult](#getdeviceinforesult-values) | \n\n#### GetDeviceInfoResult 属性值 @getdeviceinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| brand | string | 否 | - |  设备品牌 |\n| deviceBrand | string | 否 | - |  设备品牌 |\n| deviceId | string | 否 | - |  设备 id 。由 uni-app 框架生成并存储，清空 Storage 会导致改变 |\n| model | string | 否 | - |  设备型号\t |\n| deviceModel | string | 否 | - |  设备型号\t |\n| deviceType | string | 否 | - |  设备类型phone、pad、pc\t |\n| deviceOrientation | string | 否 | - |  设备方向 竖屏 portrait、横屏 landscape\t |\n| devicePixelRatio | string | 否 | - |  设备像素比\t |\n| system | string | 否 | - |  操作系统及版本\t |\n| platform | string | 否 | - |  客户端平台\t |\n| oaid | string | 否 | - |  oaid标识 Android专有  |\n| isRoot | boolean | 否 | - |  是否root |\n| isSimulator | boolean | 否 | - |  是否是模拟器 |\n| isUSBDebugging | boolean | 否 | - |  adb是否开启  |\n| idfa | string | 否 | - |  idfa标识 iOS专有  |\n\n##### GetDeviceInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 5.0 | √ | √ | 9.0 | x | x |\n| isUSBDebugging | 5.0 | √ | √ | 9.0 | x | x |\n| idfa | 5.0 | x | x | 9.0 | √ | √ |\n","compatibility":"### getDeviceInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | 3.9+ |\n","tutorial":"\n### 参见\n[getDeviceInfo](https://uniapp.dcloud.net.cn/api/system/getDeviceInfo.html)\n"},"get-device-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-device-info/get-device-info.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view class=\"uni-list\">\r\n            <view\r\n              class=\"uni-list-cell\"\r\n              v-for=\"(item, _) in items\"\r\n              style=\"align-items: center\"\r\n            >\r\n              <view class=\"uni-pd\">\r\n                <view class=\"uni-label\" style=\"width: 180px\">{{\r\n                  item.label\r\n                }}</view>\r\n              </view>\r\n              <view class=\"uni-list-cell-db\">\r\n                <textarea\r\n                  :auto-height=\"true\"\r\n                  :disabled=\"true\"\r\n                  placeholder=\"未获取\"\r\n                  :value=\"item.value\"\r\n                />\r\n              </view>\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"getDeviceInfo\">获取设备信息</button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\ntype Item = {\r\n\tlabel : string,\r\n\tvalue : string,\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'getDeviceInfo',\r\n\t\t\titems: [] as Item[],\r\n\t\t}\r\n\t},\r\n\tonUnload:function(){\r\n\t},\r\n\tmethods: {\r\n\t\tgetDeviceInfo: function () {\r\n\t\t\tconst res = uni.getDeviceInfo();\n      this.items = [] as Item[];\r\n      for(const key in res){\n        const value = res[key];\n        if(value != null){\n          const item = {\n          \tlabel: key,\n          \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n          } as Item;\n          this.items.push(item);\n        }\n      }\r\n\t\t}\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-pd {\r\n  padding-left: 30rpx;\r\n}\r\n</style>\r\n\n```"},"getWindowInfo":{"name":"## uni.getWindowInfo() @getwindowinfo","description":"同步获取窗口信息","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetWindowInfoResult](#getwindowinforesult-values) | \n\n#### GetWindowInfoResult 属性值 @getwindowinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| screenTop | number | 是 | - |  窗口上边缘的 y 值 |\n\n##### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n##### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n","compatibility":"### getWindowInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getWindowInfo](http://uniapp.dcloud.io/api/system/getWindowInfo.html)\n"},"get-window-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-window-info/get-window-info.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\" v-for=\"(item,_) in items\" style=\"align-items: center;\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">{{item.label}}</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<textarea :auto-height=\"true\" :disabled=\"true\" placeholder=\"未获取\" :value=\"item.value\" />\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getWindowInfo\">获取窗口信息</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\ttype Item = {\r\n\t\tlabel : string,\r\n\t\tvalue : string,\r\n\t}\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getWindowInfo',\r\n\t\t\t\titems: [] as Item[],\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload: function () {\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetWindowInfo: function () {\r\n\t\t\t\tconst res = uni.getWindowInfo();\n        this.items = [] as Item[];\n\t\t\t\tfor(const key in res){\n\t\t\t\t  const value = res[key];\n          if(value != null){\n            const item = {\n            \tlabel: key,\n            \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n            } as Item;\n            this.items.push(item);\n          }\n\t\t\t\t}\n\t\t\t},\n      //自动化测试例专用\n      jest_getWindowInfo():GetWindowInfoResult{\n        return uni.getWindowInfo();\n      },\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\n```"},"getAppBaseInfo":{"name":"## uni.getAppBaseInfo(options?) @getappbaseinfo","description":"获取app基本信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetAppBaseInfoOptions](#getappbaseinfooptions-values) | 否 | 包含所有字段的过滤对象 | [options=包含所有字段的过滤对象\\]  过滤的字段对象, 不传参数默认为获取全部字段。 |\n#### GetAppBaseInfoOptions 属性值 @getappbaseinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filter | Array\\<string\\> | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetAppBaseInfoResult](#getappbaseinforesult-values) | \n\n#### GetAppBaseInfoResult 属性值 @getappbaseinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| appId | string | 否 | - |  manifest.json 中应用appid，即DCloud appid。\t |\n| appName | string | 否 | - |  `manifest.json` 中应用名称。 |\n| appVersion | string | 否 | - |  `manifest.json` 中应用版本名称。 |\n| appVersionCode | string | 否 | - |  `manifest.json` 中应用版本名号。 |\n| appLanguage | string | 否 | - |  应用设置的语言en、zh-Hans、zh-Hant、fr、es\t |\n| language | string | 否 | - |  应用设置的语言\t |\n| version | string | 否 | - |  引擎版本号。已废弃，仅为了向下兼容保留 |\n| isUniAppX | boolean | 否 | - |  是否uni-app x |\n| uniCompileVersion | string | 否 | - |  uni 编译器版本 |\n| uniPlatform | string | 否 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 否 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 否 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 否 | - |  uni 运行时版本号 |\n","compatibility":"### getAppBaseInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | 3.9+ |\n","tutorial":"\n### 参见\n[getAppBaseInfo](https://uniapp.dcloud.net.cn/api/system/getAppBaseInfo.html)\n"},"get-app-base-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app-base-info/get-app-base-info.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\n\t\t\t\t<view class=\"uni-list-cell\" v-for=\"(item,_) in items\" style=\"align-items: center;\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">{{item.label}}</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<textarea :auto-height=\"true\" :disabled=\"true\" placeholder=\"未获取\" :value=\"item.value\" />\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getAppBaseInfo\">获取App基础信息</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\ttype Item = {\n\t\tlabel : string,\n\t\tvalue : string,\n\t}\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getAppBaseInfo',\n\t\t\t\titems: [] as Item[],\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetAppBaseInfo: function () {\n\t\t\t\tconst res = uni.getAppBaseInfo();\n        this.items = [] as Item[];\n        for(const key in res){\n          const value = res[key];\n          if(value != null){\n            const item = {\n            \tlabel: key,\n            \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n            } as Item;\n            this.items.push(item);\n          }\n        }\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getAppAuthorizeSetting":{"name":"## uni.getAppAuthorizeSetting() @getappauthorizesetting","description":"获取 APP 授权设置。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetAppAuthorizeSettingResult](#getappauthorizesettingresult-values) | \n\n#### GetAppAuthorizeSettingResult 属性值 @getappauthorizesettingresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| cameraAuthorized | string | 是 | - |  允许 App 使用摄像头的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.CAMERA` 权限；iOS平台没有该值 |\n| locationAuthorized | string | 是 | - |  允许 App 使用定位的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.ACCESS_COARSE_LOCATION` 权限；iOS平台：表示没有在 `manifest.json -> App模块配置` 中配置 `Geolocation(定位)` 模块 |\n| locationAccuracy | string | 否 | - |  定位准确度。true 表示模糊定位，false 表示精确定位 - reduced: 模糊定位 - full: 精准定位 - unsupported: 不支持（包括用户拒绝定位权限和没有在 `manifest.json -> App模块配置` 中配置 `Geolocation(定位)` 模块） |\n| microphoneAuthorized | string | 是 | - |  允许 App 使用麦克风的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.RECORD_AUDIO` 权限；iOS平台没有该值 |\n| notificationAuthorized | string | 是 | - |  允许 App 通知的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台没有该值；iOS平台：表示没有在 `manifest.json -> App模块配置` 中配置 `Push(推送)` 模块 |\n","compatibility":"### getAppAuthorizeSetting 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getAppAuthorizeSetting](http://uniapp.dcloud.io/api/system/getappauthorizesetting)\n"},"get-app-authorize-setting":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app-authorize-setting/get-app-authorize-setting.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用摄像头</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"cameraAuthorized\"/>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用定位</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">定位准确度</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationAccuracy\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用麦克风</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"microphoneAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权通知</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"notificationAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getAppAuthorizeSetting\">获取App授权设置</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getAppAuthorizeSetting',\n\t\t\t\tcameraAuthorized:\"\",\n\t\t\t\tlocationAuthorized:\"\",\n\t\t\t\tlocationAccuracy:\"\",\n\t\t\t\tmicrophoneAuthorized:\"\",\n\t\t\t\tnotificationAuthorized:\"\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetAppAuthorizeSetting: function () {\n\t\t\t\tconst res = uni.getAppAuthorizeSetting();\n\t\t\t\tthis.cameraAuthorized = res.cameraAuthorized;\n\t\t\t\tthis.locationAuthorized = res.locationAuthorized;\n\t\t\t\tthis.locationAccuracy = res.locationAccuracy ?? \"unsupported\";\n\t\t\t\tthis.microphoneAuthorized = res.microphoneAuthorized;\n\t\t\t\tthis.notificationAuthorized = res.notificationAuthorized;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getSystemSetting":{"name":"## uni.getSystemSetting() @getsystemsetting","description":"获取系统设置","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetSystemSettingResult](#getsystemsettingresult-values) | \n\n#### GetSystemSettingResult 属性值 @getsystemsettingresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| bluetoothEnabled | boolean | 否 | - |  蓝牙是否开启 |\n| bluetoothError | string | 否 | - |  蓝牙的报错信息 |\n| locationEnabled | boolean | 是 | - |  位置是否开启 |\n| wifiEnabled | boolean | 否 | - |  wifi是否开启 |\n| wifiError | string | 否 | - |  wifi的报错信息 |\n| deviceOrientation | string | 是 | - |  设备方向 |\n","compatibility":"### getSystemSetting 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | 9.0 | √ | 3.9+ |\n","tutorial":"\n### 参见\n[getSystemSetting](https://uniapp.dcloud.net.cn/api/system/getsystemsetting.html)\n"},"get-system-setting":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-system-setting/get-system-setting.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">蓝牙的系统开关</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"bluetoothEnabled\"/>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">地理位置的系统开关</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationEnabled\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">Wi-Fi 的系统开关</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"wifiEnabled\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">设备方向</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"deviceOrientation\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getSystemSetting\">获取系统设置</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getSystemSetting',\n\t\t\t\tbluetoothEnabled:\"\",\n\t\t\t\tlocationEnabled:\"\",\n\t\t\t\twifiEnabled:\"\",\n\t\t\t\tdeviceOrientation:\"\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetSystemSetting: function () {\n\t\t\t\tconst res = uni.getSystemSetting();\n\t\t\t\tthis.bluetoothEnabled = (res.bluetoothEnabled ?? false) ? \"开启\" : \"关闭\";\n\t\t\t\tthis.locationEnabled = res.locationEnabled ? \"开启\" : \"关闭\";\n\t\t\t\tthis.wifiEnabled = (res.wifiEnabled ?? false) ? \"开启\" : \"关闭\";\n\t\t\t\tthis.deviceOrientation = res.deviceOrientation\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getBatteryInfo":{"name":"## uni.getBatteryInfo(options) @getbatteryinfo","description":"获取电池电量信息\n> 本 API 是 [uni ext api](https://uniapp.dcloud.net.cn/api/extapi.html)，需下载插件：[uni-getbatteryinfo](https://ext.dcloud.net.cn/plugin?name=uni-getbatteryinfo)\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetBatteryInfoOptions](#getbatteryinfooptions-values) | 是 | - | - |\n#### GetBatteryInfoOptions 属性值 @getbatteryinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [GetBatteryInfoSuccess](#getbatteryinfosuccess-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n| fail | (res: UniError) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用成功的回调 |\n\n##### GetBatteryInfoSuccess 属性值 @getbatteryinfosuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n| level | number | 是 | - |  设备电量，范围1 - 100 |\n| isCharging | boolean | 是 | - |  是否正在充电中 |\n","returnValue":"","compatibility":"### getBatteryInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 3.6.11 | 3.9.0 | 9.0 | 3.6.11 | 3.9.0 |\n","tutorial":""},"getBatteryInfoSync":{"name":"## uni.getBatteryInfoSync() @getbatteryinfosync","description":"获取电池电量信息\n> 本 API 是 [uni ext api](https://uniapp.dcloud.net.cn/api/extapi.html)，需下载插件：[uni-getbatteryinfo](https://ext.dcloud.net.cn/plugin?name=uni-getbatteryinfo)\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetBatteryInfoResult](#getbatteryinforesult-values) | \n\n#### GetBatteryInfoResult 属性值 @getbatteryinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| level | number | 是 | - |  设备电量，范围1 - 100 |\n| isCharging | boolean | 是 | - |  是否正在充电中 |\n","compatibility":"### getBatteryInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 3.6.11 | 3.9.0 | 9.0 | 3.6.11 | 3.9.0 |\n","tutorial":""},"get-battery-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-battery-info/get-battery-info.uvue) \n ```html\n<template>\n\t<view>\n\t\t<text>当前电量：{{level}}%</text>\n\t\t<text>是否充电中：{{isCharging}}</text>\n\t</view>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tlevel: 0,\n\t\t\t\tisCharging: false\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tuni.getBatteryInfo({\n\t\t\t\tsuccess: res => {\n\t\t\t\t\tthis.level = res.level;\n\t\t\t\t\tthis.isCharging = res.isCharging;\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t}\n</script>\n<style>\n\n</style>\n```"},"chooseImage":{"name":"## uni.chooseImage(options) @chooseimage","description":"从本地相册选择图片或使用相机拍照","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ChooseImageOptions](#chooseimageoptions-values) | 是 | - | - |\n#### ChooseImageOptions 属性值 @chooseimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| count | number | 否 | 9 |  最多可以选择的图片张数，app端不限制，微信小程序最多可支持20个。 |\n| sizeType | Array\\<string\\> | 否 | ['original','compressed'\\] |  original 原图，compressed 压缩图，默认二者都有 |\n| sourceType | Array\\<string\\> | 否 | ['album','camera'\\] |  album 从相册选图，camera 使用相机，默认二者都有 |\n| extension | Array\\<string\\> | 否 | - |  根据文件拓展名过滤，每一项都不能是空字符串。默认不过滤。仅H5支持 |\n| crop | [ChooseImageCropOptions](#chooseimagecropoptions-values) | 否 | - |  图像裁剪参数，设置后 sizeType 失效。 |\n| success | (callback: [ChooseImageSuccessCallback](#chooseimagesuccesscallback-values)) => void | 否 | - |  成功则返回图片的本地文件路径列表 tempFilePaths |\n| fail | (callback: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (callback: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ChooseImageCropOptions 属性值 @chooseimagecropoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | number | 是 | - |  裁剪的宽度，单位为px，用于计算裁剪宽高比。 |\n| height | number | 是 | - |  裁剪的高度，单位为px，用于计算裁剪宽高比。 |\n| quality | number | 否 | 80 |  取值范围为1-100，数值越小，质量越低（仅对jpg格式有效）。默认值为80。 |\n| resize | boolean | 否 | - |  是否将width和height作为裁剪保存图片真实的像素值。默认值为true。注：设置为false时在裁剪编辑界面显示图片的像素值，设置为true时不显示。 |\n\n##### ChooseImageSuccessCallback 属性值 @chooseimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errSubject | string | 是 | - |  调用API的名称 |\n| errMsg | string | 是 | - | - |\n| tempFilePaths | Array\\<string\\> | 是 | - | - |\n| tempFiles | any | 是 | - | - |\n","returnValue":"","compatibility":"### chooseImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | - | - | - |\n","tutorial":"\n### 参见\n[chooseImage](http://uniapp.dcloud.io/api/media/image?id=chooseimage)\n"},"choose-image":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/choose-image/choose-image.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex:1\">\n  <!-- #endif -->\n    <view>\n      <page-head :title=\"title\"></page-head>\n      <view class=\"uni-common-mt\">\n        <view class=\"uni-list\">\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图片来源\n            </view>\n            <view class=\"uni-list-cell-right\" @click=\"chooseImageSource\">\n              <text class=\"click-t\">{{sourceType[sourceTypeIndex]}}</text>\n            </view>\n          </view>\n\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图片质量\n            </view>\n            <view class=\"uni-list-cell-right\" @click=\"chooseImageType\">\n              <text class=\"click-t\">{{sizeType[sizeTypeIndex]}}</text>\n            </view>\n          </view>\n\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              数量限制\n            </view>\n            <view class=\"uni-list-cell-right\">\n              <input class=\"click-t\" :value=\"countIndex+1\" type=\"number\" :maxlength=\"1\" @confirm=\"chooseImageCount\" confirm-type=\"done\" />\n            </view>\n          </view>\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图像裁剪\n            </view>\n            <view class=\"uni-list-cell-right\">\n              <switch :checked=\"isCrop\" @change=\"switchCrop\"></switch>\n            </view>\n          </view>\n          <view ref=\"cropOptionNode\" class=\"crop-option\" :style=\"{'height':isCrop?'200px':'0px'}\">\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                图片质量(%)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropPercent\" @confirm=\"cropPercentConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                裁剪宽度(px)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropWidth\" @confirm=\"cropWidthConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                裁剪高度(px)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropHeight\" @confirm=\"cropHeightConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                保留原宽高\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <switch :checked=\"cropResize\" @change=\"cropResizeChange\"></switch>\n              </view>\n            </view>\n          </view>\n        </view>\n\n        <view class=\"uni-list list-pd\" style=\"padding: 30rpx;\">\n          <view class=\"uni-flex\" style=\"margin-bottom: 20rpx;\">\n            <view class=\"uni-list-cell-left\">点击可预览选好的图片</view>\n            <view style=\"margin-left: auto;\">\n              <text class=\"click-t\">{{imageList.length}}/{{countIndex+1}}</text>\n            </view>\n          </view>\n          <view class=\"uni-flex\" style=\"flex-wrap: wrap;\">\n            <view v-for=\"(image,index) in imageList\" :key=\"index\" class=\"uni-uploader__input-box\" style=\"border: 0rpx;\">\n              <image style=\"width: 208rpx; height: 208rpx;\" :src=\"image\" :data-src=\"image\" @tap=\"previewImage(index)\"></image>\n              <image src=\"/static/plus.png\" class=\"image-remove\" @click=\"removeImage(index)\"></image>\n            </view>\n            <image class=\"uni-uploader__input-box\" @tap=\"chooseImage\" src=\"/static/plus.png\"></image>\n          </view>\n        </view>\n      </view>\n    </view>\n  <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\n  var sourceTypeArray = [\n    ['camera'],\n    ['album'],\n    ['camera', 'album']\n  ]\n  var sizeTypeArray = [\n    ['compressed'],\n    ['original'],\n    ['compressed', 'original']\n  ]\n  export default {\n    data() {\n      return {\n        title: 'choose/previewImage',\n        imageList: [] as Array<string>,\n        sourceTypeIndex: 2,\n        sourceType: ['拍照', '相册', '拍照或相册'],\n        sizeTypeIndex: 2,\n        sizeType: ['压缩', '原图', '压缩或原图'],\n        countIndex: 8,\n        count: [1, 2, 3, 4, 5, 6, 7, 8, 9],\n        isCrop: false,\n        cropPercent: 80,\n        cropWidth: 100,\n        cropHeight: 100,\n        cropResize: false\n      }\n    },\n    onUnload() {\n      this.imageList = [];\n      this.sourceTypeIndex = 2\n      this.sourceType = ['拍照', '相册', '拍照或相册']\n      this.sizeTypeIndex = 2\n      this.sizeType = ['压缩', '原图', '压缩或原图']\n      this.countIndex = 8\n    },\n    methods: {\n      cropHeightConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0) {\n          this.cropHeight = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"裁剪高度需要大于0\"\n          })\n        }\n      },\n      cropWidthConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0) {\n          this.cropWidth = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"裁剪宽度需要大于0\"\n          })\n        }\n      },\n      cropPercentConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0 && value <= 100) {\n          this.cropPercent = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"请输入0~100之间的值\"\n          })\n        }\n      },\n      cropResizeChange(e : SwitchChangeEvent) {\n        this.cropResize = e.detail.value\n      },\n      switchCrop(e : SwitchChangeEvent) {\n        this.isCrop = e.detail.value\n      },\n      removeImage(index : number) {\n        this.imageList.splice(index, 1)\n      },\n      chooseImageSource() {\n        uni.showActionSheet({\n          itemList: ['拍照', '相册', '拍照或相册'],\n          success(e) {\n            this.sourceTypeIndex = e.tapIndex!\n          }\n        })\n      },\n      chooseImageType() {\n        uni.showActionSheet({\n          itemList: ['压缩', '原图', '压缩或原图'],\n          success(e) {\n            this.sizeTypeIndex = e.tapIndex!\n          }\n        })\n      },\n      chooseImageCount(event : InputConfirmEvent) {\n        let count = parseInt(event.detail.value) - 1\n        if (count < 0) {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"图片数量应该大于0\"\n          })\n          return\n        }\n        this.countIndex = count\n      },\n      chooseImage: function () {\n        // var cropOption:ChooseImageCropOptions|null = this.isCrop ? null : new ChooseImageCropOptions(  )\n        if (this.imageList.length >= 9) {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"已经有9张图片了，请删除部分图片之后重新选择\"\n          })\n          return\n        }\n        uni.chooseImage({\n          sourceType: sourceTypeArray[this.sourceTypeIndex],\n          sizeType: sizeTypeArray[this.sizeTypeIndex],\n          crop: this.isCrop ? { \"quality\": this.cropPercent, \"width\": this.cropWidth, \"height\": this.cropHeight, \"resize\": this.cropResize } as ChooseImageCropOptions : null,\n          count: this.imageList.length + this.count[this.countIndex] > 9 ? 9 - this.imageList.length : this.count[this.countIndex],\n          success: (res) => {\n            this.imageList = this.imageList.concat(res.tempFilePaths);\n          },\n          fail: (err) => {\n            console.log(\"err: \", JSON.stringify(err));\n          }\n        })\n      },\n      previewImage: function (index : number) {\n        uni.previewImage({\n          current: index,\n          urls: this.imageList\n        })\n      }\n    }\n  }\n</script>\n\n<style>\n  .cell-pd {\n    padding: 22rpx 30rpx;\n  }\n\n  .click-t {\n    color: darkgray;\n  }\n\n  .list-pd {\n    margin-top: 50rpx;\n  }\n\n  .uni-uploader__input-box {\n    margin: 10rpx;\n    width: 208rpx;\n    height: 208rpx;\n    border: 2rpx solid #D9D9D9;\n  }\n\n  .uni-uploader__input {\n    position: absolute;\n    z-index: 1;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n  }\n\n  .image-remove {\n    transform: rotate(45deg);\n    width: 50rpx;\n    height: 50rpx;\n    position: absolute;\n    top: 0;\n    right: 0;\n    border-radius: 25rpx;\n    background-color: rgba(200, 200, 200, 0.8);\n  }\n\n  .item_width {\n    width: 260rpx;\n  }\n\n  .crop-option {\n    border-top-color: lightgray;\n    border-width: 1rpx;\n    padding: 20rpx;\n    transition: height;\n    transition-duration: 300;\n  }\n</style>\n```"},"previewImage":{"name":"## uni.previewImage(options) @previewimage","description":"预览图片","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [PreviewImageOptions](#previewimageoptions-values) | 是 | - | - |\n#### PreviewImageOptions 属性值 @previewimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| count | string | 否 | - |  当前显示图片的链接，不填则默认为 urls 的第一张 |\n| current | any | 否 | - |  current 为当前显示图片的链接/索引值，不填或填写的值无效则为 urls 的第一张。App平台在 1.9.5至1.9.8之间，current为必填。不填会报错 |\n| urls | Array\\<string\\> | 是 | - | - |\n| indicator | string | 否 | - |  图片指示器样式 - default: 底部圆点指示器 - number: 顶部数字指示器 - none: 不显示指示器 |\n| loop | boolean | 否 | - |  是否可循环预览 |\n| longPressActions | [LongPressActionsOptions](#longpressactionsoptions-values) | 否 | - |  长按图片显示操作菜单，如不填默认为保存相册，1.9.5 起支持。 |\n| success | (result: [PreviewImageSuccessCallback](#previewimagesuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### LongPressActionsOptions 属性值 @longpressactionsoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| itemList | Array\\<string\\> | 是 | - | - |\n| itemColor | string | 否 | - |  按钮的文字颜色，字符串格式，默认为\"#000000\" |\n| success | (result: [LongPressActionsSuccessData](#longpressactionssuccessdata-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: any) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n###### LongPressActionsSuccessData 属性值 @longpressactionssuccessdata-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tapIndex | number | 是 | - |  接口调用失败的回调函数 |\n| index | number | 是 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### PreviewImageSuccessCallback 属性值 @previewimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errSubject | string | 是 | - | - |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"### previewImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | - | - | - |\n","tutorial":"\n### 参见\n[previewImage](http://uniapp.dcloud.io/api/media/image?id=previewimage)\n"},"closePreviewImage":{"name":"## uni.closePreviewImage(options) @closepreviewimage","description":"关闭图片预览","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ClosePreviewImageOptions](#closepreviewimageoptions-values) | 是 | - | - |\n#### ClosePreviewImageOptions 属性值 @closepreviewimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [ClosePreviewImageSuccessCallback](#closepreviewimagesuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ClosePreviewImageSuccessCallback 属性值 @closepreviewimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n","returnValue":"","compatibility":"### closePreviewImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | - | - | - |\n","tutorial":"\n### 参见\n[closePreviewImage](http://uniapp.dcloud.io/api/media/image?id=closepreviewimage)\n"},"preview-image":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/preview-image/preview-image.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n    <!-- #endif -->\n    <view style=\"padding-left: 16rpx; padding-right: 16rpx\">\n      <view>\n        <text class=\"text-desc\">图片指示器样式</text>\n        <radio-group\n          class=\"cell-ct\"\n          style=\"background-color: white\"\n          @change=\"onIndicatorChanged\"\n        >\n          <view\n            class=\"indicator-it\"\n            v-for=\"(item, index) in indicator\"\n            :key=\"item.value\"\n          >\n            <radio :checked=\"index == 0\" :value=\"item.value\">{{\n              item.name\n            }}</radio>\n          </view>\n        </radio-group>\n      </view>\n      <view>\n        <checkbox-group\n          @change=\"onCheckboxChange\"\n          style=\"margin-top: 32rpx; margin-bottom: 32rpx; margin-left: 16rpx\"\n        >\n          <checkbox :checked=\"isLoop\" style=\"margin-right: 30rpx\"\n            >循环播放</checkbox\n          >\n        </checkbox-group>\n      </view>\n      <view style=\"background-color: white\">\n        <text class=\"text-desc\">点击图片开始预览</text>\n        <view class=\"cell-ct\" style=\"background-color: #eeeeee; padding: 16rpx\">\n          <view\n            class=\"cell cell-choose-image\"\n            v-for=\"(image, index) in imageList\"\n            :key=\"index\"\n          >\n            <image\n              style=\"width: 210rpx; height: 210rpx\"\n              mode=\"aspectFit\"\n              :src=\"image\"\n              @click=\"previewImage(index)\"\n            ></image>\n          </view>\n          <image\n            class=\"cell cell-choose-image\"\n            src=\"/static/plus.png\"\n            @click=\"chooseImage\"\n          >\n            <view></view>\n          </image>\n        </view>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\ntype ItemType = {\n\tvalue: string,\n\tname: string\n}\n\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\timageList: [\"https://web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png\", \"/static/uni.png\"],\n\t\t\tindicator: [{\n\t\t\t\tvalue: \"default\",\n\t\t\t\tname: \"圆点\"\n\t\t\t}, {\n\t\t\t\tvalue: \"number\",\n\t\t\t\tname: \"数字\"\n\t\t\t}, {\n\t\t\t\tvalue: \"none\",\n\t\t\t\tname: \"不显示\"\n\t\t\t}] as ItemType[],\n\t\t\tcurrentIndicator: \"default\",\n\t\t\tisLoop: true\n\t\t}\n\t},\n\tmethods: {\n\t\tpreviewImage(index: number) {\n\t\t\tuni.previewImage({\n\t\t\t\turls: this.imageList,\n\t\t\t\tcurrent: index,\n\t\t\t\tindicator: this.currentIndicator,\n\t\t\t\tloop: this.isLoop\n\t\t\t})\n\t\t},\n\t\tchooseImage() {\n\t\t\tuni.chooseImage({\n\t\t\t\tsourceType: ['album'],\n\t\t\t\tsuccess: (e) => {\n\t\t\t\t\tthis.imageList = this.imageList.concat(e.tempFilePaths)\n\t\t\t\t},\n\t\t\t\tfail(_) {\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\t\tonIndicatorChanged(e: RadioGroupChangeEvent) {\n\t\t\tthis.currentIndicator = e.detail.value\n\t\t},\n\t\tonCheckboxChange(_: CheckboxGroupChangeEvent) {\n\t\t\tthis.isLoop = !this.isLoop\n\t\t}\n\t}\n}\n</script>\n\n<style>\n.text-desc {\n  margin-top: 32rpx;\n  margin-left: 16rpx;\n  margin-bottom: 32rpx;\n  font-weight: bold;\n}\n\n.cell-ct {\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: row;\n}\n\n.cell {\n  margin-left: 14rpx;\n  width: 210rpx;\n  height: 210rpx;\n}\n\n.cell-choose-image {\n  border-width: 1px;\n  border-color: lightgray;\n}\n\n.indicator-it {\n  margin: 16rpx;\n}\n</style>\n\n```"},"saveImageToPhotosAlbum":{"name":"## uni.saveImageToPhotosAlbum(options) @saveimagetophotosalbum","description":"保存图片到系统相册","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SaveImageToPhotosAlbumOptions](#saveimagetophotosalbumoptions-values) | 是 | - | - |\n#### SaveImageToPhotosAlbumOptions 属性值 @saveimagetophotosalbumoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filePath | string | 是 | - |  图片文件路径，可以是临时文件路径也可以是永久文件路径，不支持网络图片路径 |\n| success | (result: [SaveImageToPhotosAlbumSuccessCallback](#saveimagetophotosalbumsuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### SaveImageToPhotosAlbumSuccessCallback 属性值 @saveimagetophotosalbumsuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  保存到相册的图片路径 |\n","returnValue":"","compatibility":"### saveImageToPhotosAlbum 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9+ | - | - | - |\n","tutorial":"\n### 参见\n[saveImageToPhotosAlbum](http://uniapp.dcloud.io/api/media/image?id=saveimagetophotosalbum)\n"},"save-image-to-photos-album":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/save-image-to-photos-album/save-image-to-photos-album.uvue) \n ```html\n<template>\n\t<!-- #ifdef APP -->\n\t<scroll-view style=\"flex:1\">\n\t\t<!-- #endif -->\n\t\t<image src=\"/static/uni.png\" style=\"margin: 30rpx 200rpx;height:350rpx;width: 350rpx;\"></image>\n\t\t<button style=\"margin: 30rpx;\" @click=\"saveImage\">将图片保存到手机相册</button>\n\t\t<!-- #ifdef APP -->\n\t</scroll-view>\n\t<!-- #endif -->\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tsaveImage() {\n\t\t\t\tuni.saveImageToPhotosAlbum({\n\t\t\t\t\tfilePath: \"/static/uni.png\",\n\t\t\t\t\tsuccess() {\n\t\t\t\t\t\tuni.showToast({\n\t\t\t\t\t\t\tposition: \"center\",\n\t\t\t\t\t\t\ticon: \"none\",\n\t\t\t\t\t\t\ttitle: \"图片保存成功，请到手机相册查看\"\n\t\t\t\t\t\t})\n\t\t\t\t\t},\n\t\t\t\t\tfail(e) {\n\t\t\t\t\t\tuni.showModal({\n\t\t\t\t\t\t\tcontent: \"保存相册失败，errCode：\" + e.errCode + \"，errMsg：\" + e.errMsg + \"，errSubject：\" + e.errSubject,\n\t\t\t\t\t\t\tshowCancel: false\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n</style>\n```"},"getLocation":{"name":"## uni.getLocation(options) @getlocation","description":"\n获取当前的地理位置、速度\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetLocationOptions](#getlocationoptions-values) | 是 | - | - |\n#### GetLocationOptions 属性值 @getlocationoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 否 | - |  默认为 wgs84 返回 gps 坐标，gcj02 返回可用于uni.openLocation的坐标 |\n| altitude | boolean | 否 | - |  传入 true 会返回高度信息，由于获取高度需要较高精确度，会减慢接口返回速度 |\n| geocode | boolean | 否 | - |  传入 true 会解析地址 |\n| highAccuracyExpireTime | number | 否 | - |  高精度定位超时时间(ms)，指定时间内返回最高精度，该值3000ms以上高精度定位才有效果 |\n| isHighAccuracy | boolean | 否 | - |  开启高精度定位 |\n| success | (result: [GetLocationSuccess](#getlocationsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: UniError) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetLocationSuccess 属性值 @getlocationsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| latitude | number | 是 | - |  纬度，浮点数，范围为-90~90，负数表示南纬 |\n| longitude | number | 是 | - |  经度，范围为-180~180，负数表示西经 |\n| speed | number | 是 | - |  速度，浮点数，单位m/s |\n| accuracy | number | 是 | - |  位置的精确度 |\n| altitude | number | 是 | - |  高度，单位 m |\n| verticalAccuracy | number | 是 | - |  垂直精度，单位 m（Android 无法获取，返回 0） |\n| horizontalAccuracy | number | 是 | - |  水平精度，单位 m |\n| address | any | 否 | - |  地址信息 |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[getLocation](http://uniapp.dcloud.io/api/location/location?id=getlocation)\n"},"get-location":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-location/get-location.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view style=\"padding: 4px;\">\n    \t<text class=\"hello-text\">\n        真机运行标准基座仅包含系统定位，即system。\\n\n        部分手机因gms兼容不好可能导致无法定位。\\n\n        gcj国标、逆地理信息等功能需三方sdk定位。如果需要类似能力可以下载腾讯定位插件，打包自定义基座。参考示例：</text>\n    \t<u-link :href=\"'https://ext.dcloud.net.cn/plugin?id=14569'\" :text=\"'https://ext.dcloud.net.cn/plugin?id=14569'\" :inWhiteList=\"true\"></u-link>\n    </view>\n\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-list\">\n        <radio-group @change=\"radioChange\">\n          <radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line': ''\" :value=\"item.value\"\n            :checked=\"index === current\">\n            {{item.name}}\n          </radio>\n        </radio-group>\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">高度信息</view>\n        <switch :checked=\"altitudeSelect\" @change=\"altitudeChange\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">开启高精度定位</view>\n        <switch :checked=\"isHighAccuracySelect\" @change=\"highAccuracySelectChange\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">是否解析地址信息</view>\n        <switch :checked=\"geocodeSelect\" @change=\"geocodeChange\" />\n      </view>\n      <text>{{exeRet}}</text>\n      <view class=\"uni-btn-v\">\n        <button class=\"uni-btn\" type=\"default\" @tap=\"getLocationTap\">获取定位</button>\n      </view>\n    </view>\n  </view>\n</template>\n<script lang=\"uts\">\n  type ItemType = {\n    value : string,\n    name : string,\n  }\n  export default {\n    data() {\n      return {\n        title: 'get-location',\n        altitudeSelect: false,\n        isHighAccuracySelect: false,\n        geocodeSelect: false,\n        exeRet: '',\n        items: [\n        {\n          value: 'wgs84',\n          name: 'wgs84'\n        },\n        {\n          value: 'gcj02',\n          name: 'gcj02'\n        }\n        ] as ItemType[],\n        current: 0,\n      }\n    },\n    methods: {\n      altitudeChange: function (e : SwitchChangeEvent) {\n        this.altitudeSelect = e.detail.value\n      },\n      geocodeChange: function (e : SwitchChangeEvent) {\n        this.geocodeSelect = e.detail.value\n      },\n      highAccuracySelectChange: function (e : SwitchChangeEvent) {\n        this.isHighAccuracySelect = e.detail.value\n      },\n      radioChange(e : RadioGroupChangeEvent) {\n        for (let i = 0; i < this.items.length; i++) {\n          if (this.items[i].value === e.detail.value) {\n            this.current = i;\n            break;\n          }\n        }\n      },\n      getLocationTap: function () {\n        uni.showLoading({\n          title: '定位中'\n        })\n        uni.getLocation(({\n          type: this.items[this.current].value,\n          altitude: this.altitudeSelect,\n          isHighAccuracy: this.isHighAccuracySelect,\n          geocode: this.geocodeSelect,\n          success: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          },\n          fail: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          },\n          complete: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          }\n        }));\n\n\n      }\n\n    }\n  }\n</script>\n<style>\n@import '@/common/uni-uvue.css';\n</style>\n\n```"},"setStorage":{"name":"## uni.setStorage(options) @setstorage","description":"\nuni.setStorage函数定义\n将数据存储在本地storage存储中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。  \n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetStorageOptions](#setstorageoptions-values) | 是 | - |  uni.setStorage参数定义 |\n#### SetStorageOptions 属性值 @setstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| data | any | 是 | - |  需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象 |\n| success | (res: [SetStorageSuccess](#setstoragesuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### setStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[setStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#setstorage)\n"},"setStorageSync":{"name":"## uni.setStorageSync(key, data) @setstoragesync","description":"\nuni.setStorageSync函数定义\n将 data 存储在本地storage存储中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个同步接口。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地storage存储中的指定的 key |\n| data | any | 是 | - | 需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象 |","returnValue":"","compatibility":"### setStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[setStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#setstoragesync)\n"},"getStorage":{"name":"## uni.getStorage(options) @getstorage","description":"\nuni.getStorage函数定义\n从本地存储中异步获取指定 key 对应的内容。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetStorageOptions](#getstorageoptions-values) | 是 | - |  uni.getStorage参数定义 |\n#### GetStorageOptions 属性值 @getstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| success | (res: [GetStorageSuccess](#getstoragesuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetStorageSuccess 属性值 @getstoragesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 否 | - |  key 对应的内容 |\n","returnValue":"","compatibility":"### getStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorage)\n"},"getStorageSync":{"name":"## uni.getStorageSync(key) @getstoragesync","description":"\nuni.getStorageSync函数定义\n从本地存储中同步获取指定 key 对应的内容。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地存储中的指定的 key |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 | \n","compatibility":"### getStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstoragesync)\n"},"getStorageInfo":{"name":"## uni.getStorageInfo(options) @getstorageinfo","description":"\nuni.getStorageInfo函数定义\n异步获取当前 storage 的相关信息。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetStorageInfoOptions](#getstorageinfooptions-values) | 是 | - |  uni.getStorageInfo参数定义 |\n#### GetStorageInfoOptions 属性值 @getstorageinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [GetStorageInfoSuccess](#getstorageinfosuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetStorageInfoSuccess 属性值 @getstorageinfosuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| keys | Array\\<string\\> | 是 | - | - |\n| currentSize | number | 是 | - |  当前占用的空间大小, 单位：kb |\n| limitSize | number | 是 | - |  限制的空间大小, 单位：kb |\n","returnValue":"","compatibility":"### getStorageInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageInfo](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorageinfo)\n"},"getStorageInfoSync":{"name":"## uni.getStorageInfoSync() @getstorageinfosync","description":"\nuni.getStorageInfoSync函数定义\n同步获取当前 storage 的相关信息。\n\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetStorageInfoSuccess](#getstorageinfosuccess-values) | \n\n#### GetStorageInfoSuccess 属性值 @getstorageinfosuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| keys | Array\\<string\\> | 是 | - | - |\n| currentSize | number | 是 | - |  当前占用的空间大小, 单位：kb |\n| limitSize | number | 是 | - |  限制的空间大小, 单位：kb |\n","compatibility":"### getStorageInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageInfoSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorageinfosync)\n"},"removeStorage":{"name":"## uni.removeStorage(options) @removestorage","description":"\nuni.removeStorage函数定义\n从本地存储中异步移除指定 key。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RemoveStorageOptions](#removestorageoptions-values) | 是 | - |  uni.removeStorage参数定义 |\n#### RemoveStorageOptions 属性值 @removestorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| success | (res: [RemoveStorageSuccess](#removestoragesuccess-values)) => void | 否 | - |  接口调用的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### removeStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[removeStorage](hhttps://uniapp.dcloud.net.cn/api/storage/storage.html#removestorage)\n"},"removeStorageSync":{"name":"## uni.removeStorageSync(key) @removestoragesync","description":"\nuni.removeStorageSync函数定义\n从本地存储中同步移除指定 key。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地存储中的指定的 key |","returnValue":"","compatibility":"### removeStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[removeStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#removestoragesync)\n"},"clearStorage":{"name":"## uni.clearStorage(option?) @clearstorage","description":"\nuni.clearStorage函数定义\n清除本地数据存储。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| option | [ClearStorageOptions](#clearstorageoptions-values) | 否 | - | - |\n#### ClearStorageOptions 属性值 @clearstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [ClearStorageSuccess](#clearstoragesuccess-values)) => void | 否 | - |  接口调用的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### clearStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[clearStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#clearstorage)\n"},"clearStorageSync":{"name":"## uni.clearStorageSync() @clearstoragesync","description":"\nuni.clearStorageSync函数定义\n清除本地数据存储。\n","param":"","returnValue":"","compatibility":"### clearStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[clearStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#clearstoragesync)\n"},"storage":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/storage/storage.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view class=\"uni-list-cell uni-list-cell-line\">\r\n            <view class=\"uni-list-cell-left\">\r\n              <view class=\"uni-label\">key</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <input\r\n                class=\"uni-input\"\r\n                type=\"text\"\r\n                placeholder=\"请输入key\"\r\n                name=\"key\"\r\n                :value=\"key\"\r\n                @input=\"keyChange\"\r\n              />\r\n            </view>\r\n          </view>\r\n          <view class=\"uni-list-cell\">\r\n            <view class=\"uni-list-cell-left\">\r\n              <view class=\"uni-label\">value</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <input\r\n                class=\"uni-input\"\r\n                type=\"text\"\r\n                placeholder=\"请输入value\"\r\n                name=\"data\"\r\n                :value=\"data\"\r\n                @input=\"dataChange\"\r\n              />\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button class=\"uni-btn btn-getStorageInfoASync\" type=\"primary\" @tap=\"getStorageInfo\">\r\n              获取存储概述-异步\r\n            </button>\r\n            <button class=\"uni-btn btn-getStorageInfoSync\" @tap=\"getStorageInfoSync\">\r\n              获取存储概述-同步\r\n            </button>\r\n          </view>\r\n          <text>{{ storageInfo }}</text>\r\n          <view class=\"uni-flex uni-row\">\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"strMock\"\r\n            >\r\n              填充字符串\r\n            </button>\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"complexMock\"\r\n            >\r\n              填充复杂对象\r\n            </button>\r\n          </view>\r\n          <view class=\"uni-flex uni-row\">\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"numberMock\"\r\n            >\r\n              填充整型\r\n            </button>\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"floatMock\"\r\n            >\r\n              填充浮点型\r\n            </button>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button\r\n              type=\"primary\"\r\n              class=\"uni-btn btn-setstorageAsync\"\r\n              @tap=\"setStorage\"\r\n            >\r\n              存储数据-异步\r\n            </button>\r\n            <button class=\"uni-btn btn-getstorageAsync\" @tap=\"getStorage\">读取数据-异步</button>\r\n            <button class=\"uni-btn btn-removeStorageInfoASync\" @tap=\"removeStorage\">移除数据-异步</button>\r\n            <button class=\"uni-btn btn-clearStorageInfoASync\" @tap=\"clearStorage\">清理数据-异步</button>\r\n          </view>\r\n\r\n          <view class=\"uni-btn-v\">\r\n            <button\r\n              type=\"primary\"\r\n              class=\"uni-btn btn-setstorageSync\"\r\n              @tap=\"setStorageSync\"\r\n            >\r\n              存储数据-同步\r\n            </button>\r\n            <button class=\"uni-btn btn-getstorageSync\" @tap=\"getStorageSync\">读取数据-同步</button>\r\n            <button class=\"uni-btn btn-removeStorageInfoSync\" @tap=\"removeStorageSync\">\r\n              移除数据-同步\r\n            </button>\r\n            <button class=\"uni-btn btn-clearStorageInfoSync\" @tap=\"clearStorageSync\">\r\n              清理数据-同步\r\n            </button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      title: 'get/set/clearStorage',\r\n      key: '',\r\n      data: '' as any,\n      apiGetData:'' as any|null,\r\n      storageInfo: '',\r\n    }\r\n  },\r\n  methods: {\r\n    getStorageInfo() {\r\n      uni.getStorageInfo({\r\n        success: function (res) {\n          this.apiGetData = res\r\n          this.storageInfo = JSON.stringify(res)\r\n        },\r\n      })\r\n    },\r\n    getStorageInfoSync() {\r\n      try {\r\n        const res = uni.getStorageInfoSync()\n        this.apiGetData = res\r\n        this.storageInfo = JSON.stringify(res)\n      } catch (e) {\r\n        // error\r\n        console.log(e)\r\n      }\r\n    },\r\n    strMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = '测试字符串数据，长度为16个字符'\r\n    },\r\n    complexMock() {\r\n      this.key = 'key_' + Math.random()\r\n      let jsonObj = {\r\n        name: '张三',\r\n        age: 12,\r\n        classMate: [\r\n          {\r\n            id: 1001,\r\n            name: '李四',\r\n          },\r\n          {\r\n            id: 1002,\r\n            name: 'jack ma',\r\n          },\r\n        ],\r\n      }\r\n      this.data = jsonObj\r\n    },\r\n    numberMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = 10011\r\n    },\r\n    floatMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = 3.1415926535893384626\r\n    },\r\n\r\n    keyChange: function (e: InputEvent) {\r\n      this.key = e.detail.value\r\n    },\r\n    dataChange: function (e: InputEvent) {\r\n      this.data = e.detail.value\r\n    },\r\n    getStorage: function () {\r\n      var key = this.key\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '读取数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\n        let that = this\r\n        uni.getStorage({\r\n          key: key,\r\n          success: (res) => {\n            that.apiGetData = res.data\n\n            let desc:string = typeof this.apiGetData\n            if(\"object\" == desc){\n              desc = desc  + \": \" + JSON.stringify(this.apiGetData)\n            }else{\n              desc = desc  + \": \" + this.apiGetData\n            }\n\r\n            uni.showModal({\r\n              title: '读取数据成功',\r\n              content: desc,\r\n              showCancel: false,\r\n            })\r\n          },\r\n          fail: () => {\r\n            uni.showModal({\r\n              title: '读取数据失败',\r\n              content: '找不到 key 对应的数据',\r\n              showCancel: false,\r\n            })\r\n          },\r\n        })\r\n      }\r\n    },\r\n    getStorageSync: function () {\r\n      var key = this.key\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '读取数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        this.apiGetData = uni.getStorageSync(key)\n\n        let desc:string = typeof this.apiGetData\n        if(\"object\" == desc){\n          desc = desc  + \": \" + JSON.stringify(this.apiGetData)\n        }else{\n          desc = desc  + \": \" + this.apiGetData\n        }\n\r\n        uni.showModal({\r\n          title: '读取数据成功',\r\n          content:  desc,\r\n          showCancel: false,\r\n        })\r\n      }\r\n    },\r\n    setStorage: function () {\r\n      var key = this.key\r\n      var data = this.data\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '保存数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        uni.setStorage({\r\n          key: key,\r\n          data: data,\r\n          success: () => {\r\n            uni.showModal({\r\n              title: '存储数据成功',\r\n              showCancel: false,\r\n            })\r\n          },\r\n          fail: () => {\r\n            uni.showModal({\r\n              title: '储存数据失败!',\r\n              showCancel: false,\r\n            })\r\n          },\r\n        })\r\n      }\r\n    },\r\n    setStorageSync: function () {\r\n      var key = this.key\r\n      var data = this.data\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '保存数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        uni.setStorageSync(key, data)\r\n        uni.showModal({\r\n          title: '存储数据成功',\r\n          showCancel: false,\r\n        })\r\n      }\r\n    },\r\n    removeStorage: function () {\r\n      uni.removeStorage({\r\n        key: this.key,\r\n        success: () => {\r\n          uni.showModal({\r\n            title: '移除数据成功',\r\n            showCancel: false,\r\n          })\r\n        },\r\n        fail: () => {\r\n          uni.showModal({\r\n            title: '移除数据失败',\r\n            showCancel: false,\r\n          })\r\n        },\r\n      })\r\n    },\r\n    removeStorageSync: function () {\r\n      uni.removeStorageSync(this.key)\r\n      uni.showModal({\r\n        title: '移除数据成功',\r\n        showCancel: false,\r\n      })\r\n    },\r\n    clearStorage: function () {\r\n      this.key = ''\r\n      this.data = ''\r\n      uni.clearStorage({\r\n        success: function (_) {\r\n          uni.showModal({\r\n            title: '清除数据成功',\r\n            showCancel: false,\r\n          })\r\n        },\r\n        fail: function (_) {\r\n          uni.showModal({\r\n            title: '清除数据失败',\r\n            showCancel: false,\r\n          })\r\n        },\r\n      })\r\n    },\r\n    clearStorageSync: function () {\r\n      this.key = ''\r\n      this.data = ''\r\n      uni.clearStorageSync()\r\n      uni.showModal({\r\n        title: '清除数据成功',\r\n        content: ' ',\r\n        showCancel: false,\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.btn-setstorage {\r\n  background-color: #007aff;\r\n  color: #ffffff;\r\n}\r\n\r\n.button-sp-area {\r\n  flex-direction: row;\r\n  margin: 0 auto;\r\n}\r\n</style>\r\n\n```"},"createWebviewContext":{"name":"## uni.createWebviewContext(webviewId, component?) @createwebviewcontext","description":"创建 web-view 组件的上下文对象，用于操作 web-view 的行为。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| webviewId | string | 是 | - | - |\n| component | ComponentPublicInstance | 否 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [WebviewContext](#webviewcontext-values) | 否 | \n\n#### WebviewContext 属性值 @webviewcontext-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| back | () => void | 是 | - | 后退到 web-view 组件网页加载历史的上一页，如果不存在上一页则没有任何效果。 |\n| forward | () => void | 是 | - | 前进到 web-view 组件网页加载历史的下一页，如果不存在下一页则没有任何效果。 |\n| reload | () => void | 是 | - | 重新加载 web-view 组件当前页面。 |\n| stop | () => void | 是 | - | 停止加载 web-view 组件当前网页，该方法不能阻止已经加载的 html 文档，但是能够阻止未完成的图片及延迟加载的资源。 |\n| evalJS | (js: string) => void | 是 | - | 在网页中执行指定的js脚本，在 uvue 页面中可通过此方法向 web-view 组件加载的页面发送数据 |\n","compatibility":"","tutorial":""},"createVideoContext":{"name":"## uni.createVideoContext(videoId, component?) @createvideocontext","description":"创建并返回 video 上下文 videoContext 对象","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| videoId | string | 是 | - | - |\n| component | ComponentPublicInstance | 否 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [VideoContext](#videocontext-values) | 否 | \n\n#### VideoContext 属性值 @videocontext-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| play | () => void | 是 | - | 播放 |\n| pause | () => void | 是 | - | 暂停 |\n| seek | (position: number) => void | 是 | - | 跳转到指定位置 |\n| stop | () => void | 是 | - | 停止视频 |\n| sendDanmu | (danmu: [Danmu](#danmu-values)) => void | 是 | - | 发送弹幕 |\n| playbackRate | (rate: number) => void | 是 | - | 设置倍速播放 |\n| requestFullScreen | (direction?: [RequestFullScreenOptions](#requestfullscreenoptions-values)) => void | 是 | - | 进入全屏 |\n| exitFullScreen | () => void | 是 | - | 退出全屏 |\n\n##### Danmu 属性值 @danmu-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 否 | - |  弹幕文字 |\n| color | string | 否 | - |  弹幕颜色 |\n| time | number | 否 | - |  显示时刻 |\n\n##### RequestFullScreenOptions 属性值 @requestfullscreenoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | number | 否 | - |  direction - 0: 正常竖向 - 90: 屏幕逆时针90度 - -90: 屏幕顺时针90度 |\n\n##### VideoContext 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| play | 4.4 | √ | 3.9.0 | - | - | - |\n| pause | 4.4 | √ | 3.9.0 | - | - | - |\n| seek | 4.4 | √ | 3.9.0 | - | - | - |\n| stop | 4.4 | √ | 3.9.0 | - | - | - |\n| sendDanmu | 4.4 | √ | 3.9.0 | - | - | - |\n| playbackRate | 4.4 | √ | 3.9.0 | - | - | - |\n| requestFullScreen | 4.4 | √ | 3.9.0 | - | - | - |\n| exitFullScreen | 4.4 | √ | 3.9.0 | - | - | - |\n","compatibility":"### createVideoContext 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | √ | - | - | - |\n","tutorial":"\n### 参见\n[createVideoContext](http://uniapp.dcloud.io/api/media/video-context?id=createVideoContext)\n"},"general_type":{"name":"## 通用类型\n","param":"### GeneralCallbackResult \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n"}}
\ No newline at end of file
+{"getApp":{"name":"## getApp() @getapp","description":"\r\n`getApp()` 函数用于获取当前应用实例。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [AppInstance\\<T> & T](#appinstance-values) | \n\n#### AppInstance\\<T> & T 属性值 @appinstance-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| onLaunch | (options?: [OnLaunchOptions](#onlaunchoptions-values)) => void | 否 | - |  生命周期回调 监听应用初始化  应用初始化完成时触发，全局只触发一次。  |\n| onShow | (options?: [OnShowOptions](#onshowoptions-values)) => void | 否 | - |  生命周期回调 监听应用显示  应用启动，或从后台进入前台显示时触发  |\n| onHide | () => void | 否 | - |  生命周期回调 监听应用隐藏  应用从前台进入后台时触发  |\n| onExit | () => void | 否 | - |  监听应用退出。app-uvue-android 3.9+  |\n| onLastPageBackPress | () => void | 否 | - |  最后一个页面按下Android back键，常用于自定义退出。app-uvue-android 3.9+  |\n\n##### OnLaunchOptions 属性值 @onlaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  \t应用启动页面路径 |\n\n##### OnShowOptions 属性值 @onshowoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  \t应用启动页面路径 |\n\n##### AppInstance<T> & T 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| onLaunch | 5.0 | √ | √ | 10.0 | √ | x |\n| onShow | 5.0 | √ | √ | 10.0 | √ | x |\n| onHide | 5.0 | √ | √ | 10.0 | √ | x |\n| onExit | 5.0 | x | √ | x | x | x |\n| onLastPageBackPress | 5.0 | x | √ | x | x | x |\n","compatibility":"","tutorial":"\n### 参见\n[getApp](https://uniapp.dcloud.net.cn/uni-app-x/api/getapp.html#getapp)\n"},"get-app":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app/get-app.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getApp\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text>点击按钮调用 App.uvue methods</text>\n      <text class=\"margin-top:6px;\">increasetLifeCycleNum 方法</text>\n      <button class=\"uni-common-mt\" @click=\"_increasetLifeCycleNum\">\n        increase lifeCycleNum\n      </button>\n      <text class=\"uni-common-mt\">lifeCycleNum: {{ lifeCycleNum }}</text>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nimport { State, state, setLifeCycleNum } from '@/store/index.uts'\n\nexport default {\n  data() {\n    return {\n      lifeCycleNum: 0,\n    }\n  },\n  onReady() {\n    this.lifeCycleNum = state.lifeCycleNum\n  },\n  methods: {\n    _increasetLifeCycleNum: function () {\n      const app = getApp()\n      app.increasetLifeCycleNum()\n      this.lifeCycleNum = state.lifeCycleNum\n    },\n    // 自动化测试\n    setLifeCycleNum(num: number) {\n      setLifeCycleNum(num)\n    },\n  },\n}\n</script>\n\n```"},"getCurrentPages":{"name":"## getCurrentPages() @getcurrentpages","description":"\r\n`getCurrentPages()` 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，数组中的元素为页面实例，第一个元素为首页，最后一个元素为当前页面。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| Array\\<[BasePage](#basepage-values)\\> | \n\n#### BasePage 属性值 @basepage-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| route | string | 是 | - | - |\n| options | Map\\<string, string \\\\| null> | 是 | - | - |\n","compatibility":"","tutorial":"\n### 参见\n[getCurrentPages](https://uniapp.dcloud.net.cn/tutorial/page.html#getcurrentpages)\n"},"get-current-pages":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-current-pages/get-current-pages.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getCurrentPages\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <button @click=\"_getCurrentPages\">getCurrentPages</button>\n      <view v-if=\"pages.length\" style=\"padding: 15px 0px\">\n        <text>当前页面栈中 {{ pages.length }} 个页面，列表如下：</text>\n        <template v-for=\"(page, index) in pages\" :key=\"page.route\">\n          <text style=\"margin-top: 5px\"\n            >index: {{ index }}, route: {{ page.route }}</text\n          >\n        </template>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nclass Page {\n  constructor(public route : string) {\n  }\n}\n\nexport default {\n  data() {\n    return {\n      checked: false,\n      pages: [] as Page[],\n    }\n  },\n  methods: {\n    _getCurrentPages: function () {\n      this.pages.length = 0\n      const pages = getCurrentPages()\n      this.pages.push(new Page(pages[0].route))\n      if (this.pages[0].route.includes('/tabBar/')) {\n        this.checked = true\n      }\n      for (let i = 1; i < pages.length; i++) {\n        this.pages.push(new Page(pages[i].route))\n        if (pages[i].route.includes('/tabBar/')) {\n          this.checked = false\n        }\n      }\n    },\n  },\n}\n</script>\n\n```"},"$on":{"name":"## uni.$on(eventName, callback) @$on","description":"\n监听自定义事件。事件可以由 uni.$emit 触发。回调函数会接收 uni.$emit 传递的参数。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | Function\\<unknown> | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$on](http://uniapp.dcloud.io/api/window/communication?id=on)\n"},"$off":{"name":"## uni.$off(eventName, callback) @$off","description":"\n移除自定义事件监听器。如果没有指定事件名，则移除所有事件监听器。如果提供事件名，则移除该事件的所有监听器。如果提供了事件名和回调，则只移除这个回调的监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | Function\\<unknown> | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$off](http://uniapp.dcloud.io/api/window/communication?id=off)\n"},"$once":{"name":"## uni.$once(eventName, callback) @$once","description":"\n监听一个自定义事件。事件只触发一次，在第一次触发之后移除事件监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| callback | Function\\<unknown> | 是 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$once](http://uniapp.dcloud.io/api/window/communication?id=once)\n"},"$emit":{"name":"## uni.$emit(eventName, args?) @$emit","description":"\n触发自定义事件，附加的参数会传递给事件监听器。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| eventName | string | 是 | - | - |\n| args | any | 否 | - | - |","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[$emit](http://uniapp.dcloud.io/api/window/communication?id=emit)\n"},"event-bus":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/event-bus/event-bus.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <button @click=\"on\">开始监听</button>\r\n      <button @click=\"once\">监听一次</button>\r\n      <button @click=\"off\">取消监听</button>\r\n      <button @click=\"emit\">触发监听</button>\r\n      <button @click=\"clear\">清空消息</button>\r\n      <view class=\"box\">\r\n        <view>收到的消息：</view>\r\n        <view>\r\n          <view v-for=\"(item, index) in log\" :key=\"index\">{{ item }}</view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      log: [] as string[],\r\n    }\r\n  },\r\n  methods: {\r\n    fn(res: string) {\r\n      this.log.push(res)\r\n    },\r\n    on() {\r\n      uni.$on('test', this.fn)\r\n    },\r\n    once() {\r\n      uni.$once('test', this.fn)\r\n    },\r\n    off() {\r\n      uni.$off('test', this.fn)\r\n    },\r\n    emit() {\r\n      uni.$emit('test', 'msg:' + Date.now())\r\n    },\r\n    clear() {\r\n      this.log.length = 0\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.box {\r\n  padding: 10px;\r\n}\r\n</style>\r\n\n```"},"getLaunchOptionsSync":{"name":"## uni.getLaunchOptionsSync() @getlaunchoptionssync","description":"\n获取本次启动时的参数。返回值与App.onLaunch的回调参数一致\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [OnLaunchOptions](#onlaunchoptions-values) | \n\n#### OnLaunchOptions 属性值 @onlaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - | - |\n","compatibility":"","tutorial":"\n### 参见\n[getLaunchOptionsSync](http://uniapp.dcloud.io/api/plugins/getLaunchOptionsSync)\n"},"get-launch-options-sync":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-launch-options-sync/get-launch-options-sync.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"getLaunchOptionsSync\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <button @click=\"getLaunchOptionsSync\">getLaunchOptionsSync</button>\n      <view v-if=\"launchOptionsPath.length > 0\" class=\"uni-common-mt\">\n        <text>应用启动路径：</text>\n        <text style=\"margin-top: 5px\">{{ launchOptionsPath }}</text>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nexport default {\n  data() {\n    return {\n      checked: false,\n      homePagePath: '/pages/tabBar/component',\n      launchOptionsPath: '',\n    }\n  },\n  methods: {\n    getLaunchOptionsSync() {\n      const launchOptions = uni.getLaunchOptionsSync()\n      this.launchOptionsPath = launchOptions.path\n      if (launchOptions.path == this.homePagePath) {\n        this.checked = true\n      }\n    },\n  },\n}\n</script>\n\n```"},"exit":{"name":"## uni.exit(options?) @exit","description":"\n退出当前应用","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ExitOptions](#exitoptions-values) | 否 | - | - |\n#### ExitOptions 属性值 @exitoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [ExitSuccess](#exitsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ExitSuccess 属性值 @exitsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"### exit 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 3.8.15 | 3.9.0 | x | x | x |\n","tutorial":"","example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/exit/exit.uvue) \n ```html\n<template>\n\t<view>\n\t\t<button @tap=\"exitAppClick\">退出应用</button>\n\t</view>\n</template>\n\n<script>\n\texport default {\n\t\tmethods: {\n\t\t\texitAppClick:function(){\n\t\t\t\tuni.exit({\n\t\t\t\t\tsuccess:function(res){\n\t\t\t\t\t\tconsole.log(res)\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n\n</style>\n```"},"navigateTo":{"name":"## uni.navigateTo(options) @navigateto","description":"\n保留当前页面，跳转到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [NavigateToOptions](#navigatetooptions-values) | 是 | - | - |\n#### NavigateToOptions 属性值 @navigatetooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### NavigateToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### navigateTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[navigateTo](http://uniapp.dcloud.io/api/router?id=navigateto)\n"},"redirectTo":{"name":"## uni.redirectTo(options) @redirectto","description":"\n关闭当前页面，跳转到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RedirectToOptions](#redirecttooptions-values) | 是 | - | - |\n#### RedirectToOptions 属性值 @redirecttooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### RedirectToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### redirectTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[redirectTo](http://uniapp.dcloud.io/api/router?id=redirectto)\n"},"reLaunch":{"name":"## uni.reLaunch(options) @relaunch","description":"\n关闭所有页面，打开到应用内的某个页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ReLaunchOptions](#relaunchoptions-values) | 是 | - | - |\n#### ReLaunchOptions 属性值 @relaunchoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### ReLaunchOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### reLaunch 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[reLaunch](http://uniapp.dcloud.io/api/router?id=relaunch)\n"},"switchTab":{"name":"## uni.switchTab(options) @switchtab","description":"\n跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SwitchTabOptions](#switchtaboptions-values) | 是 | - | - |\n#### SwitchTabOptions 属性值 @switchtaboptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  需要跳转的 tabBar 页面的路径，路径后不能带参数 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SwitchTabOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| url | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### switchTab 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[switchTab](http://uniapp.dcloud.io/api/router?id=switchtab)\n"},"navigateBack":{"name":"## uni.navigateBack(options?) @navigateback","description":"\n关闭当前页面，返回上一页面或多级页面\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [NavigateBackOptions](#navigatebackoptions-values) | 否 | - | - |\n#### NavigateBackOptions 属性值 @navigatebackoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| delta | number | 否 | - |  返回的页面数，如果 delta 大于现有页面数，则返回到首页 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### NavigateBackOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| delta | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### navigateBack 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[navigateBack](http://uniapp.dcloud.io/api/router?id=navigateback)\n"},"navigator":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/navigator/navigator.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head title=\"navigate\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt uni-common-mb\">\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onLoad触发时间戳:</text>\r\n          <text>{{ onLoadTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onShow触发时间戳:</text>\r\n          <text>{{ onShowTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onReady触发时间戳:</text>\r\n          <text>{{ onReadyTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onHide触发时间戳:</text>\r\n          <text>{{ onHideTime }}</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onBackPress触发时间戳:</text>\r\n          <text>见控制台</text>\r\n        </view>\r\n        <view class=\"direction-row\">\r\n          <text class=\"label\">onUnload触发时间戳:</text>\r\n          <text>见控制台</text>\r\n        </view>\r\n        <view class=\"uni-btn-v\">\r\n          <button @tap=\"navigateTo\" class=\"uni-btn\">\r\n            跳转新页面，并传递数据\r\n          </button>\r\n          <button @tap=\"navigateBack\" class=\"uni-btn\">返回上一页</button>\r\n          <button @tap=\"redirectTo\" class=\"uni-btn\">在当前页面打开</button>\r\n          <button @tap=\"switchTab\" class=\"uni-btn\">切换到模板选项卡</button>\r\n          <button @tap=\"reLaunch\" class=\"uni-btn\">\r\n            关闭所有页面，打开首页\r\n          </button>\r\n          <button @tap=\"navigateToErrorPage\" class=\"uni-btn\">\r\n            打开不存在的页面\r\n          </button>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nimport { State, state, setLifeCycleNum } from '@/store/index.uts'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      onLoadTime: 0,\r\n      onShowTime: 0,\r\n      onReadyTime: 0,\r\n      onHideTime: 0,\r\n    }\r\n  },\r\n  onLoad() {\r\n    this.onLoadTime = Date.now()\r\n    console.log('onLoad', this.onLoadTime)\r\n  },\r\n  onShow() {\r\n    this.onShowTime = Date.now()\r\n    console.log('onShow', this.onShowTime)\r\n  },\r\n  onReady() {\r\n    this.onReadyTime = Date.now()\r\n    console.log('onReady', this.onReadyTime)\r\n  },\r\n  onHide() {\r\n    this.onHideTime = Date.now()\r\n    console.log('onHide', this.onHideTime)\r\n  },\r\n  onBackPress(options: OnBackPressOptions): boolean | null {\r\n    console.log('onBackPress', Date.now())\r\n    console.log('onBackPress from', options.from)\r\n    return null\r\n  },\r\n  onUnload() {\r\n    console.log('onUnload', Date.now())\r\n  },\r\n  methods: {\r\n    reLaunch() {\r\n      uni.reLaunch({\r\n        url: '/pages/tabBar/component',\r\n        success(result) {\r\n          console.log('reLaunch success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('reLaunch fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('reLaunch complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateTo() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=Hello',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateToErrorPage() {\r\n      uni.navigateTo({\r\n        url: '/pages/error-page/error-page',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          uni.showToast({\r\n            title: error.errMsg,\r\n            icon: 'none',\r\n          })\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateToDebounce() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=debounce',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=debounce',\r\n        success(result) {\r\n          console.log('navigateTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath1() {\r\n      uni.navigateTo({\r\n        url: 'new-page/new-page-1?data=new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath2() {\r\n      uni.navigateTo({\r\n        url: './new-page/new-page-1?data=./new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    navigateToRelativePath3() {\r\n      uni.navigateTo({\r\n        url: '../navigator/new-page/new-page-1?data=../navigator/new-page/new-page-1',\r\n        success() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail() {\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete() {\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateBack() {\r\n      uni.navigateBack({\r\n        success(result) {\r\n          console.log('navigateBack success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('navigateBack fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('navigateBack complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    navigateBackWithDelta1() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1',\r\n        success() {\r\n          uni.navigateBack({\r\n            delta: 1,\r\n            success(result) {\r\n              console.log('navigateBack success', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n            fail(error) {\r\n              console.log('navigateBack fail', error.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum - 1)\r\n            },\r\n            complete(result) {\r\n              console.log('navigateBack complete', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n          })\r\n        },\r\n      })\r\n    },\r\n    navigateBackWithDelta100() {\r\n      uni.navigateTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1',\r\n        success() {\r\n          uni.navigateBack({\r\n            delta: 100,\r\n            success(result) {\r\n              console.log('navigateBack success', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n            fail(error) {\r\n              console.log('navigateBack fail', error.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum - 1)\r\n            },\r\n            complete(result) {\r\n              console.log('navigateBack complete', result.errMsg)\r\n              // 自动化测试\r\n              setLifeCycleNum(state.lifeCycleNum + 1)\r\n            },\r\n          })\r\n        },\r\n      })\r\n    },\r\n    redirectTo() {\r\n      uni.redirectTo({\r\n        url: '/pages/API/navigator/new-page/new-page-1?data=Hello',\r\n        success(result) {\r\n          console.log('redirectTo success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('redirectTo fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('redirectTo complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    switchTab() {\r\n      uni.switchTab({\r\n        url: '/pages/tabBar/template',\r\n        success(result) {\r\n          console.log('switchTab success', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n        fail(error) {\r\n          console.log('switchTab fail', error.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum - 1)\r\n        },\r\n        complete(result) {\r\n          console.log('switchTab complete', result.errMsg)\r\n          // 自动化测试\r\n          setLifeCycleNum(state.lifeCycleNum + 1)\r\n        },\r\n      })\r\n    },\r\n    // 自动化测试\r\n    getLifeCycleNum(): number {\r\n      return state.lifeCycleNum\r\n    },\r\n    // 自动化测试\r\n    setLifeCycleNum(num: number) {\r\n      setLifeCycleNum(num)\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.direction-row {\r\n  flex-direction: row;\r\n}\r\n.label {\r\n  width: 190px;\r\n}\r\n</style>\r\n\n```"},"setNavigationBarColor":{"name":"## uni.setNavigationBarColor(options) @setnavigationbarcolor","description":"\n设置导航条、状态栏颜色\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetNavigationBarColorOptions](#setnavigationbarcoloroptions-values) | 是 | - | - |\n#### SetNavigationBarColorOptions 属性值 @setnavigationbarcoloroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| frontColor | #ffffff \\\\| #000000 | 是 | - |  前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 |\n| backgroundColor | string | 是 | - |  背景颜色值，有效值为十六进制颜色 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (error: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetNavigationBarColorOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| frontColor | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### setNavigationBarColor 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[setNavigationBarColor](http://uniapp.dcloud.io/api/ui/navigationbar?id=setnavigationbarcolor)\n"},"set-navigation-bar-color":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/set-navigation-bar-color/set-navigation-bar-color.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"setNavigationBarColor\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <button @tap=\"setNavigationBarColor1\" class=\"uni-btn\">\n        设置导航条背景绿色，标题白色\n      </button>\n      <button @tap=\"setNavigationBarColor2\" class=\"uni-btn\">\n        设置导航条背景红色，标题黑色\n      </button>\n      <button @tap=\"goCustomNavigation\" class=\"uni-btn\">\n        跳转自定义导航栏页面\n      </button>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nimport { state, setLifeCycleNum } from '@/store/index.uts'\n\nexport default {\n  methods: {\n    setNavigationBarColor1() {\n      uni.setNavigationBarColor({\n        frontColor: '#ffffff',\n        backgroundColor: '#00ff00',\n        success() {\n          console.log('setNavigationBarColor success')\n        },\n        fail() {\n          console.log('setNavigationBarColor success')\n        },\n        complete() {\n          console.log('setNavigationBarColor success')\n        }\n      })\n    },\n    setNavigationBarColor2() {\n      uni.setNavigationBarColor({\n        frontColor: '#000000',\n        backgroundColor: '#ff0000',\n        success() {\n          console.log('setNavigationBarColor success')\n        },\n        fail() {\n          console.log('setNavigationBarColor success')\n        },\n        complete() {\n          console.log('setNavigationBarColor success')\n        }\n      })\n    },\n    // 自动化测试\n    getLifeCycleNum(): number {\n      return state.lifeCycleNum\n    },\n    // 自动化测试\n    setLifeCycleNum(num: number) {\n      setLifeCycleNum(num)\n    },\n    goCustomNavigation(){\n      uni.navigateTo({\n        url: '/pages/API/set-navigation-bar-color/set-custom-navigation-bar-color'\n      })\n    }\n  },\n}\n</script>\n\n<style>\n.direction-row {\n  flex-direction: row;\n}\n.label {\n  width: 190px;\n}\n</style>\n\n```"},"setTabBarBadge":{"name":"## uni.setTabBarBadge(options) @settabbarbadge","description":"\n为 tabBar 某一项的右上角添加文本\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarBadgeOptions](#settabbarbadgeoptions-values) | 是 | - | - |\n#### SetTabBarBadgeOptions 属性值 @settabbarbadgeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| text | string | 是 | - |  显示的文本，不超过 3 个半角字符 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarBadge](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbarbadge)\n"},"removeTabBarBadge":{"name":"## uni.removeTabBarBadge(options) @removetabbarbadge","description":"\n移除 tabBar 某一项右上角的文本\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RemoveTabBarBadgeOptions](#removetabbarbadgeoptions-values) | 是 | - | - |\n#### RemoveTabBarBadgeOptions 属性值 @removetabbarbadgeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[removeTabBarBadge](http://uniapp.dcloud.io/api/ui/tabbar?id=removetabbarbadge)\n"},"setTabBarItem":{"name":"## uni.setTabBarItem(options) @settabbaritem","description":"\n动态设置 tabBar 某一项的内容\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarItemOptions](#settabbaritemoptions-values) | 是 | - | - |\n#### SetTabBarItemOptions 属性值 @settabbaritemoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar 的哪一项，从左边算起，索引从0开始 |\n| text | string | 否 | - |  tab 上按钮文字 |\n| iconPath | string | 否 | - |  图片路径 |\n| selectedIconPath | string | 否 | - |  选中时的图片路径 |\n| pagePath | string | 否 | - |  页面绝对路径 |\n| iconfont | [SetTabBarItemIconFontOptions](#settabbaritemiconfontoptions-values) | 否 | - |  字体图标，优先级高于 iconPath |\n| visible | boolean | 否 | - |  tab 是否显示 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### SetTabBarItemIconFontOptions 属性值 @settabbaritemiconfontoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 是 | - |  字库 Unicode 码 |\n| selectedText | string | 是 | - |  选中后字库 Unicode 码 |\n| fontSize | string | 否 | - |  字体图标字号(px) |\n| color | string | 否 | - |  字体图标颜色 |\n| selectedColor | string | 否 | - |  字体图标选中颜色 |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarItem](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbaritem)\n"},"setTabBarStyle":{"name":"## uni.setTabBarStyle(options) @settabbarstyle","description":"\n动态设置 tabBar 的整体样式\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetTabBarStyleOptions](#settabbarstyleoptions-values) | 是 | - | - |\n#### SetTabBarStyleOptions 属性值 @settabbarstyleoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| color | string | 否 | - |  tab 上的文字默认颜色 |\n| selectedColor | string | 否 | - |  tab 上的文字选中时的颜色 {HBuilderX.ColorString} |\n| backgroundColor | string | 否 | - |  tab 的背景色 |\n| backgroundImage | string | 否 | - |  图片背景 |\n| backgroundRepeat | string | 否 | - |  背景图平铺方式 |\n| borderStyle | string | 否 | - |  tabbar上边框的颜色 |\n| midButton | [MidButtonOptions](#midbuttonoptions-values) | 否 | - |  tabbar 中间按钮 仅在 list 项为偶数时有效 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### MidButtonOptions 属性值 @midbuttonoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | string | 否 | - |  中间按钮的宽度，tabBar 其它项为减去此宽度后平分，默认值为与其它项平分宽度。默认 80px |\n| height | string | 否 | - |  中间按钮的高度，可以大于 tabBar 高度，达到中间凸起的效果。默认 50px |\n| text | string | 否 | - |  中间按钮的文字 |\n| iconPath | string | 否 | - |  中间按钮的图片路径 |\n| iconWidth | string | 否 | - |  图片宽度（高度等比例缩放）。默认 24px |\n| backgroundImage | string | 否 | - |  中间按钮的背景图片路径 |\n| iconfont | [MidButtonIconFont](#midbuttoniconfont-values) | 否 | - |  字体图标，优先级高于 iconPath |\n\n###### MidButtonIconFont 属性值 @midbuttoniconfont-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 否 | - |  字库 Unicode 码 |\n| selectedText | string | 否 | - |  选中后字库 Unicode 码 |\n| fontSize | string | 否 | - |  字体图标字号(px) |\n| color | string | 否 | - |  字体图标颜色 |\n| selectedColor | string | 否 | - |  字体图标选中颜色 |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[setTabBarStyle](http://uniapp.dcloud.io/api/ui/tabbar?id=settabbarstyle)\n"},"hideTabBar":{"name":"## uni.hideTabBar(options?) @hidetabbar","description":"\n隐藏 tabBar\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [HideTabBarOptions](#hidetabbaroptions-values) | 否 | - | - |\n#### HideTabBarOptions 属性值 @hidetabbaroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| animation | boolean | 否 | - |  是否需要动画效果 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[hideTabBar](http://uniapp.dcloud.io/api/ui/tabbar?id=hidetabbar)\n"},"showTabBar":{"name":"## uni.showTabBar(options?) @showtabbar","description":"\n显示 tabBar\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowTabBarOptions](#showtabbaroptions-values) | 否 | - | - |\n#### ShowTabBarOptions 属性值 @showtabbaroptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| animation | boolean | 否 | - |  是否需要动画效果 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[showTabBar](http://uniapp.dcloud.io/api/ui/tabbar?id=showtabbar)\n"},"showTabBarRedDot":{"name":"## uni.showTabBarRedDot(options) @showtabbarreddot","description":"\n显示 tabBar 某一项的右上角的红点\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowTabBarRedDotOptions](#showtabbarreddotoptions-values) | 是 | - | - |\n#### ShowTabBarRedDotOptions 属性值 @showtabbarreddotoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[showTabBarRedDot](http://uniapp.dcloud.io/api/ui/tabbar?id=showtabbarreddot)\n"},"hideTabBarRedDot":{"name":"## uni.hideTabBarRedDot(options) @hidetabbarreddot","description":"\n隐藏 tabBar 某一项的右上角的红点\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [HideTabBarRedDotOptions](#hidetabbarreddotoptions-values) | 是 | - | - |\n#### HideTabBarRedDotOptions 属性值 @hidetabbarreddotoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| index | number | 是 | - |  tabBar的哪一项，从左边算起，索引从0开始 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [SetTabBarError](#settabbarerror-values)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### SetTabBarError 属性值 @settabbarerror-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | SetTabBarErrCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| errMsg | string | 是 | - |  统一错误描述信息 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| name | string | 是 | - | - |\n| message | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[hideTabBarRedDot](http://uniapp.dcloud.io/api/ui/tabbar?id=hidetabbarreddot)\n"},"stopPullDownRefresh":{"name":"## uni.stopPullDownRefresh() @stoppulldownrefresh","description":"\n停止当前页面下拉刷新\n","param":"","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[stopPullDownRefresh](http://uniapp.dcloud.io/api/ui/pulldown?id=stoppulldownrefresh)\n"},"pull-down-refresh":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/pull-down-refresh/pull-down-refresh.uvue) \n ```html\n<template>\n\t<scroll-view>\n\t\t<!-- 实际开发中，长列表应该使用list-view -->\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\n\t\t\t<text class=\"text\" v-for=\"(num,index) in data\" :key=\"index\">list - {{num}}</text>\n\t\t\t<view class=\"uni-loadmore\" v-if=\"showLoadMore\">{{loadMoreText}}</view>\n\t\t</view>\n\t</scroll-view>\n</template>\n<script lang=\"uts\">\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tdata: [] as Array<number>,\n\t\t\t\tloadMoreText: \"加载中...\",\n\t\t\t\tshowLoadMore: false,\n\t\t\t\tmax: 0\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tthis.initData();\n\t\t},\n\t\tonReachBottom() {\n\t\t\tconsole.log(\"onReachBottom\");\n\t\t\tif (this.max > 40) {\n\t\t\t\tthis.loadMoreText = \"没有更多数据了!\"\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.showLoadMore = true;\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.setListData();\n\t\t\t}, 300);\n\t\t},\n\t\tonPullDownRefresh() {\n\t\t\tconsole.log('onPullDownRefresh');\n\t\t\tthis.initData();\n\t\t},\n\t\tmethods: {\n\t\t\tinitData(){\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tthis.max = 0;\n\t\t\t\t\tthis.data = [];\n\t\t\t\t\tlet data:Array<number> = [];\n\t\t\t\t\tthis.max += 20;\n\t\t\t\t\tfor (let i:number = this.max - 19; i < this.max + 1; i++) {\n\t\t\t\t\t\tdata.push(i)\n\t\t\t\t\t}\n\t\t\t\t\tthis.data = this.data.concat(data);\n\t\t\t\t\tuni.stopPullDownRefresh();\n\t\t\t\t}, 300);\n\t\t\t},\n\t\t\tsetListData() {\n\t\t\t\tlet data:Array<number> = [];\n\t\t\t\tthis.max += 10;\n\t\t\t\tfor (let i:number = this.max - 9; i < this.max + 1; i++) {\n\t\t\t\t\tdata.push(i)\n\t\t\t\t}\n\t\t\t\tthis.data = this.data.concat(data);\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n\t.text {\n\t\tmargin: 16rpx 0;\n\t\twidth:100%;\n\t\tbackground-color: #fff;\n\t\theight: 120rpx;\n\t\tline-height: 120rpx;\n\t\ttext-align: center;\n\t\tcolor: #555;\n\t\tborder-radius: 8rpx;\n\t}\n</style>\n\n```"},"pageScrollTo":{"name":"## uni.pageScrollTo(options) @pagescrollto","description":"\n将页面滚动到目标位置\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [PageScrollToOptions](#pagescrolltooptions-values) | 是 | - | - |\n#### PageScrollToOptions 属性值 @pagescrolltooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 否 | - |  滚动到页面的目标位置 |\n| selector | string | 否 | - |  选择器 |\n| offsetTop | number | 否 | - |  偏移距离，可以滚动到 selector 加偏移距离的位置 |\n| duration | number | 否 | - |  滚动动画的时长 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### PageScrollToOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| offsetTop | 5.0 | x | 3.91 | 10.0 | x | x |\n","returnValue":"","compatibility":"### pageScrollTo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | 3.91 | 10.0 | √ | √ |\n","tutorial":"\n### 参见\n[pageScrollTo](http://uniapp.dcloud.io/api/ui/scroll?id=pagescrollto)\n"},"page-scroll-to":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/page-scroll-to/page-scroll-to.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\" scroll-with-animation=\"true\">\n    <!-- #endif -->\n    <view class=\"uni-padding-wrap\">\n      <page-head :title=\"title\"></page-head>\n      <button type=\"default\" class=\"btn-scrollTo\" @click=\"scrollTo\">\n        scrollTo\n      </button>\n      <button\n        type=\"default\"\n        class=\"btn-scrollToElement\"\n        @click=\"scrollToElement\"\n      >\n        scrollToElement\n      </button>\n      <view class=\"uni-list\" v-for=\"(_, index) in 10\" :key=\"index\">\n        <view class=\"uni-list-cell list-item\">{{ index }}</view>\n      </view>\n      <view class=\"custom-element\">scrollTo-custom-element</view>\n      <view class=\"uni-list\" v-for=\"(_, index2) in 10\" :key=\"index2\">\n        <view class=\"uni-list-cell list-item\">{{ index2 }}</view>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      title: 'pageScrollTo',\n    }\n  },\n  methods: {\n    scrollTo() {\n      uni.pageScrollTo({\n        scrollTop: 100,\n        duration: 300,\n        success: () => {\n          console.log('success')\n        },\n      })\n    },\n    scrollToElement() {\n      uni.pageScrollTo({\n        selector: '.custom-element',\n        duration: 300,\n        success: () => {\n          console.log('success')\n        },\n      })\n    },\n  },\n}\n</script>\n\n<style>\n.list-item {\n  height: 100px;\n  padding-left: 30px;\n}\n</style>\n\n```"},"getElementById":{"name":"## uni.getElementById(id) @getelementbyid","description":"\n返回一个匹配特定 ID 的元素， 如果不存在，返回 null。\\\n如果需要获取指定的节点类型，需要使用 as 进行类型转换。\\\nID 区分大小写，且应该是唯一的。如果存在多个匹配的元素，则返回第一个匹配的元素。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| id | string | 是 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [Element](/uni-app-x/dom/element.md) | 否 | \n","compatibility":"### getElementById 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | x | 3.91 | 10.0 | x | x |\n","tutorial":"\n### 参见\n[getElementById](https://uniapp.dcloud.net.cn/uni-app-x/api/get-element-by-id.html)\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-element-by-id/get-element-by-id.uvue) \n ```html\n<template>\n  <view>\n    <page-head id=\"page-head\" title=\"getElementById\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text id=\"text\">this is text</text>\n      <view id=\"view\" class=\"uni-common-mt\" style=\"border: 1px solid red\"\n        >this is view</view\n      >\n      <button class=\"uni-btn\" @click=\"changePageHeadBackgroundColor\">\n        修改 page-head 背景色\n      </button>\n      <button class=\"uni-btn\" @click=\"changeTextColor\">\n        修改 text 字体颜色\n      </button>\n      <button class=\"uni-btn\" @click=\"changeViewStyle\">\n        修改 view 宽高及背景色\n      </button>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\nexport default {\n  data() {\n    return {\n      checked: false,\n      homePagePath: '/pages/tabBar/component',\n      launchOptionsPath: '',\n    }\n  },\n  methods: {\n    getElementByNotExistId(): Element | null {\n      return uni.getElementById('not-exist-id')\n    },\n    changePageHeadBackgroundColor(){\n      const pageHead = uni.getElementById('page-head')!\n      pageHead.style.setProperty('backgroundColor', 'red')\n    },\n    changeTextColor(){\n      const text = uni.getElementById('text')!\n      text.style.setProperty('color', 'red')\n    },\n    changeViewStyle(){\n      const view = uni.getElementById('view')!\n      view.style.setProperty('width', '90%')\n      view.style.setProperty('height', '50px')\n      view.style.setProperty('backgroundColor', '#007AFF')\n    }\n  }\n}\n</script>\n\n```"},"createSelectorQuery":{"name":"## uni.createSelectorQuery() @createselectorquery","description":"\n返回一个SelectorQuery对象实例\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [SelectorQuery](#selectorquery-values) | \n\n#### SelectorQuery 属性值 @selectorquery-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| in | (component?: any) => [SelectorQuery](#selectorquery-values) | 是 | - |  将选择器的选取范围更改为自定义组件component内 |\n| select | (selector: string) => [NodesRef](#nodesref-values) | 是 | - |  在当前页面下选择第一个匹配选择器selector的节点 |\n| selectAll | (selector: string) => [NodesRef](#nodesref-values) | 是 | - |  在当前页面下选择匹配选择器selector的所有节点 |\n| selectViewport | () => [NodesRef](#nodesref-values) | 是 | - |  选择显示区域 |\n| exec | (callback: (result: Array\\<any\\>) => void) => [NodesRef](#nodesref-values) | 是 | - |  执行所有的请求 |\n\n##### NodesRef 属性值 @nodesref-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| boundingClientRect | (callback?: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  添加节点的布局位置的查询请求，相对于显示区域，以像素为单位 |\n| scrollOffset | (callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  添加节点的滚动位置查询请求，以像素为单位 |\n| fields | (fields: [NodeField](#nodefield-values), callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  获取节点的相关信息，需要获取的字段在fields中指定 |\n| node | (callback: (result: any) => void) => [SelectorQuery](#selectorquery-values) | 是 | - |  获取 Node 节点实例。目前支持 Canvas 的获取。 |\n\n###### NodeField 属性值 @nodefield-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| id | boolean | 否 | - |  是否返回节点 id |\n| dataset | boolean | 否 | - |  是否返回节点 dataset |\n| rect | boolean | 否 | - |  是否返回节点布局位置（left right top bottom） |\n| size | boolean | 否 | - |  是否返回节点尺寸（width height） |\n| scrollOffset | boolean | 否 | - |  是否返回节点的 scrollLeft scrollTop，节点必须是 scroll-view 或者 viewport |\n| properties | Array\\<string\\> | 否 | - |  指定属性名列表，返回节点对应属性名的当前属性值（只能获得组件文档中标注的常规属性值，id class style 和事件绑定的属性值不可获取） |\n| computedStyle | Array\\<string\\> | 否 | - |  指定样式名列表，返回节点对应样式名的当前值 |\n","compatibility":"### createSelectorQuery 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | 3.91 | 10.0 | √ | √ |\n","tutorial":"\n### 参见\n[createSelectorQuery](http://uniapp.dcloud.io/api/ui/nodes-info?id=createselectorquery)\n"},"nodes-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/nodes-info/nodes-info.uvue) \n ```html\n<template>\n  <view class=\"uni-padding-wrap\">\n    <page-head :title=\"title\"></page-head>\n    <button class=\"btn btn-get-node-info\" @click=\"getNodeInfo\">getNodeInfo</button>\n    <button class=\"btn btn-get-all-node-info\" @click=\"getAllNodeInfo\">getAllNodeInfo</button>\n    <view class=\"rect-1-2\">\n      <view class=\"rect rect1\"></view>\n      <view class=\"rect rect2\"></view>\n    </view>\n    <view class=\"rect-info-1-2\">\n      <view class=\"rect-info\" v-for=\"(nodeInfo, index) in nodeInfoList\" :key=\"index\">\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">left: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.left}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">top: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.top}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">right: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.right}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">bottom: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.bottom}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">width: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.width}}</text>\n        </view>\n        <view class=\"node-info-item\">\n          <text class=\"node-info-item-k\">height: </text>\n          <text class=\"node-info-item-v\">{{nodeInfo.height}}</text>\n        </view>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n  type NodeInfoType = {\n    left : number | null,\n    top : number | null,\n    right : number | null,\n    bottom : number | null,\n    width : number | null,\n    height : number | null,\n  }\n\n  export default {\n    data() {\n      return {\n        title: 'createSelectorQuery',\n        nodeInfoList: [] as NodeInfoType[],\n      }\n    },\n    methods: {\n      getNodeInfo() {\n        uni.createSelectorQuery().select('.rect1').boundingClientRect().exec((ret) => {\n          this.nodeInfoList.length = 0\n          const i = ret[0] as NodeInfo\n          this.nodeInfoList.push({\n            left: i.left,\n            top: i.top,\n            right: i.right,\n            bottom: i.bottom,\n            width: i.width,\n            height: i.height,\n          } as NodeInfoType)\n        })\n      },\n      getAllNodeInfo() {\n        uni.createSelectorQuery().selectAll('.rect').boundingClientRect().exec((ret) => {\n          this.nodeInfoList.length = 0\n          const array = ret[0] as NodeInfo[]\n          array.forEach((i) => {\n            this.nodeInfoList.push({\n              left: i.left,\n              top: i.top,\n              right: i.right,\n              bottom: i.bottom,\n              width: i.width,\n              height: i.height,\n            } as NodeInfoType)\n          })\n        })\n      }\n    }\n  }\n</script>\n\n<style>\n  .btn {\n    margin-top: 15px;\n  }\n\n  .rect-1-2 {\n    flex-direction: row;\n    margin-top: 15px;\n  }\n\n  .rect {\n    width: 150px;\n    height: 100px;\n  }\n\n  .rect1 {\n    background-color: dodgerblue;\n  }\n\n  .rect2 {\n    margin-left: auto;\n    background-color: seagreen;\n  }\n\n  .rect-info-1-2 {\n    flex-direction: row;\n    margin-top: 15px;\n  }\n\n  .rect-info {\n    flex: 1;\n    flex-direction: column;\n  }\n\n  .node-info-item {\n    flex-direction: row;\n  }\n\n  .node-info-item-k {\n    width: 72px;\n    line-height: 2;\n  }\n\n  .node-info-item-v {\n    font-weight: bold;\n    line-height: 2;\n  }\n</style>\n```"},"showToast":{"name":"## uni.showToast(options) @showtoast","description":"显示消息提示框","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowToastOptions](#showtoastoptions-values) | 是 | - |  uni.showToast参数定义 |\n#### ShowToastOptions 属性值 @showtoastoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 是 | - |  提示的内容，长度与 icon 取值有关。 |\n| icon | string | 否 | - | icon值说明 success: 显示成功图标，error: 显示错误图标； fail: 显示错误图标，此时title文本无长度显示； exception: 显示异常图标，此时title文本无长度显示； loading: 显示加载图标；none: 不显示图标。 |\n| image | string | 否 | - |  自定义图标的本地路径（app端暂不支持gif） |\n| mask | boolean | 否 | - |  是否显示透明蒙层，防止触摸穿透，默认：false |\n| duration | number | 否 | - |  提示的延迟时间，单位毫秒，默认：1500 |\n| position | string | 否 | - | position值说明（仅App生效） top: 居上显示； center: 居中显示；bottom： 居底显示 |\n| success | (res: [ShowToastSuccess](#showtoastsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### showToast 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showToast]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showtoast))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/toast/toast.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast1Tap\">点击弹出默认toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toastTapIconError\">点击弹出设置icon的toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast2Tap\">点击弹出设置duration的toast</button>\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast3Tap\">点击弹出显示loading的toast</button>\r\n        <!-- #ifndef MP-ALIPAY -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast4Tap\">点击弹出显示自定义图片的toast</button>\r\n        <!-- #endif -->\r\n        <!-- #ifdef APP-PLUS -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"toast5Tap\">点击显示无图标的居底toast</button>\r\n        <!-- #endif -->\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"hideToast\">点击隐藏toast</button>\r\n      </view>\r\n      <text>{{exeRet}}</text>\r\n    </view>\r\n  </view>\r\n</template>\r\n<script lang=\"uts\">\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'toast',\r\n        exeRet: ''\r\n      }\r\n    },\r\n    methods: {\r\n      toast1Tap: function () {\r\n        uni.showToast({\r\n          title: \"默认\",\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toastTapIconError: function () {\r\n        uni.showToast({\r\n          title: \"默认\",\r\n          icon: 'error',\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast2Tap: function () {\r\n        uni.showToast({\r\n          title: \"duration 3000\",\r\n          duration: 3000,\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast3Tap: function () {\r\n        uni.showToast({\r\n          title: \"loading\",\r\n          icon: \"loading\",\r\n          duration: 5000,\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      toast4Tap: function () {\r\n        uni.showToast({\r\n          title: \"logo\",\r\n          image: \"/static/uni.png\",\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      // #ifdef APP-PLUS\r\n      toast5Tap: function () {\r\n        uni.showToast({\r\n          title: \"显示一段轻提示\",\r\n          position: 'bottom',\r\n          success: function (res) {\r\n            this.exeRet = \"success:\" + JSON.stringify(res) + new Date()\r\n          },\r\n          fail: function (res) {\r\n            this.exeRet = \"fail:\" + JSON.stringify(res)\r\n          },\r\n        })\r\n      },\r\n      // #endif\r\n      hideToast: function () {\r\n        uni.hideToast()\r\n      }\r\n    }\r\n  }\r\n</script>\n\n```"},"showLoading":{"name":"## uni.showLoading(options) @showloading","description":"显示 loading 提示框, 需主动调用 uni.hideLoading 才能关闭提示框。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowLoadingOptions](#showloadingoptions-values) | 是 | - |  uni.showLoading参数定义 |\n#### ShowLoadingOptions 属性值 @showloadingoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 是 | - |  提示的内容，长度与 icon 取值有关。 |\n| mask | boolean | 否 | - |  是否显示透明蒙层，防止触摸穿透，默认：false |\n| success | (res: [ShowLoadingSuccess](#showloadingsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### showLoading 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showLoading]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showloading))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/loading/loading.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view class=\"uni-list\">\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">是否显示透明蒙层-屏蔽点击事件</view>\n        <switch :checked=\"maskSelect\" @change=\"maskChange\" />\n      </view>\n      <view class=\"uni-padding-wrap\">\n        <view class=\"uni-title uni-common-mt\">\n          <text class=\"uni-title-text\"> 设置标题 </text>\n        </view>\n      </view>\n      <view class=\"uni-list uni-common-pl\">\n        <radio-group @change=\"radioChange\" class=\"radio-group\">\n          <radio class=\"uni-list-cell uni-list-cell-pd radio\" v-for=\"(item, index) in items\" :key=\"item.value\"\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\" :value=\"item.value\"\n            :checked=\"index === current\">\n            {{ item.name }}\n          </radio>\n        </radio-group>\n      </view>\n    </view>\n    <view class=\"uni-padding-wrap\">\n      <view class=\"uni-btn-v\">\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"showLoading\">显示 loading 提示框</button>\n        <!-- #ifndef MP-ALIPAY -->\n        <button class=\"uni-btn-v\" @click=\"hideLoading\">隐藏 loading 提示框</button>\n        <!-- #endif -->\n      </view>\n    </view>\n  </view>\n</template>\n<script lang=\"uts\">\n  type ItemType = {\n    value : string\n    name : string\n  }\n  export default {\n    data() {\n      return {\n        title: 'loading',\n        items: [\n          {\n            value: 'null',\n            name: '无标题',\n          },\n          {\n            value: '三秒后自动关闭',\n            name: '普通标题',\n          },\n          {\n            value: '超长文本内容，测试超出范围-超长文本内容，测试超出范围-三秒后自动关闭',\n            name: '长标题',\n          },\n        ] as ItemType[],\n        current: 0,\n        maskSelect: false,\n        titleSelect: \"null\"\n      }\n    },\n    methods: {\n\n      radioChange(e : RadioGroupChangeEvent) {\n        const selected = this.items.find((item) : boolean => {\n          return item.value == e.detail.value\n        })\n        if (selected != null) {\n          this.titleSelect = selected.value\n        }\n      },\n      maskChange: function (e : SwitchChangeEvent) {\n        this.maskSelect = e.detail.value\n      },\n      showLoading: function () {\n\n        console.log(this.titleSelect)\n        if (this.titleSelect == \"null\") {\n          uni.showLoading({\n            title: \"\",\n            mask: this.maskSelect\n          });\n        } else {\n          uni.showLoading({\n            title: this.titleSelect,\n            mask: this.maskSelect\n          });\n        }\n        // #ifdef MP-ALIPAY\n        this._showTimer && clearTimeout(this._showTimer);\n        this._showTimer = setTimeout(() => {\n          this.hideLoading();\n        }, 3000)\n        // #endif\n        // #ifdef APP-PLUS\n        setTimeout(function () {\n          this.hideLoading();\n        }, 3000);\n        // #endif\n      },\n      hideLoading: function () {\n        uni.hideLoading();\n      }\n    }\n    // #ifdef MP-ALIPAY\n    ,\n    onUnload() {\n      // 页面卸载的时候，手动关闭loading\n      this._showTimer && clearTimeout(this._showTimer);\n    }\n    // #endif\n  }\n</script>\n```"},"showModal":{"name":"## uni.showModal(options) @showmodal","description":"显示模态弹窗，可以只有一个确定按钮，也可以同时有确定和取消按钮。类似于一个API整合了 html 中：alert、confirm。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowModalOptions](#showmodaloptions-values) | 是 | - |  uni.showModal 参数定义 |\n#### ShowModalOptions 属性值 @showmodaloptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 否 | - |  提示的标题 |\n| content | string | 否 | - |  提示的内容 |\n| showCancel | boolean | 否 | true\r\n是否显示取消按钮，默认为 true |  |\n| cancelText | string | 否 | - |  取消按钮的文字，默认为\"取消\" |\n| cancelColor | string | 否 | - |  取消按钮的文字颜色，默认为\"#000000\" |\n| confirmText | string | 否 | - |  确定按钮的文字，默认为\"确定\" |\n| confirmColor | string | 否 | - |  确定按钮的文字颜色 |\n| editable | boolean | 否 | false\r\n是否显示输入框 |  |\n| placeholderText | string | 否 | - |  显示输入框时的提示文本 |\n| success | (res: [ShowModalSuccess](#showmodalsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ShowModalSuccess 属性值 @showmodalsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| confirm | boolean | 是 | - |  为 true 时，表示用户点击了确定按钮 |\n| cancel | boolean | 是 | - |  为 true 时，表示用户点击了取消（用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭） |\n| content | string | 否 | - |  editable 为 true 时，用户输入的文本 |\n","returnValue":"","compatibility":"### showModal 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showModal]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showmodal))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/modal/modal.uvue) \n ```html\n<template>\r\n\t<!-- #ifdef APP -->\r\n\t<scroll-view style=\"flex: 1\">\r\n\t\t<!-- #endif -->\r\n\t\t<view>\r\n\t\t\t<page-head :title=\"title\"></page-head>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<radio-group @change=\"radioChange\">\r\n\t\t\t\t\t<radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\r\n\t\t\t\t\t\t:class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\" :value=\"item.value\"\r\n\t\t\t\t\t\t:checked=\"index === current\">\r\n\t\t\t\t\t\t{{ item.name }}\r\n\t\t\t\t\t</radio>\r\n\t\t\t\t</radio-group>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示取消按钮</view>\r\n\t\t\t\t\t<switch :checked=\"showCancelSelect\" @change=\"showCancelChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制取消文案</view>\r\n\t\t\t\t\t<switch :checked=\"cancelTextSelect\" @change=\"cancelTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制确认文案</view>\r\n\t\t\t\t\t<switch :checked=\"confirmTextSelect\" @change=\"confirmTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示输入框</view>\r\n\t\t\t\t\t<switch :checked=\"editableSelect\" @change=\"editableChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否定制输入提示词</view>\r\n\t\t\t\t\t<switch :checked=\"placeholderTextSelect\" @change=\"placeholderTextChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button class=\"uni-btn-v\" type=\"default\" @tap=\"modalTap\">\r\n\t\t\t\t\t\tmodal测试\r\n\t\t\t\t\t</button>\r\n\t\t\t\t</view>\r\n\t\t\t\t<text>{{ exeRet }}</text>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t\t<!-- #ifdef APP -->\r\n\t</scroll-view>\r\n\t<!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\n\ttype ItemType = {\r\n\t\tvalue : string,\r\n\t\tname : string,\r\n\t}\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'modal',\r\n\t\t\t\tshowCancelSelect: false,\r\n\t\t\t\tcancelTextSelect: false,\r\n\t\t\t\tconfirmTextSelect: false,\r\n\t\t\t\teditableSelect: false,\r\n\t\t\t\tplaceholderTextSelect: false,\r\n\t\t\t\texeRet: \"\",\r\n\t\t\t\titems: [{\r\n\t\t\t\t\tvalue: '标题',\r\n\t\t\t\t\tname: '有标题'\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: '',\r\n\t\t\t\t\tname: '无标题'\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',\r\n\t\t\t\t\tname: '超长标题'\r\n\t\t\t\t}\r\n\t\t\t\t] as ItemType[],\r\n\t\t\t\tcurrent: 0\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tshowCancelChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.showCancelSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tcancelTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.cancelTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tconfirmTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.confirmTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\teditableChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.editableSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tplaceholderTextChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.placeholderTextSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tradioChange(e : RadioGroupChangeEvent) {\r\n\t\t\t\tfor (let i = 0; i < this.items.length; i++) {\r\n\t\t\t\t\tif (this.items[i].value === e.detail.value) {\r\n\t\t\t\t\t\tthis.current = i;\r\n\t\t\t\t\t\tbreak;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tmodalTap: function () {\r\n\t\t\t\tlet cancelTextVal : string\r\n\t\t\t\tlet cancelColorVal = ''\r\n\t\t\t\tif (this.cancelTextSelect) {\r\n\t\t\t\t\tcancelTextVal = \"修改后的取消文本\"\r\n\t\t\t\t\tcancelColorVal = \"#ff00ff\"\r\n\t\t\t\t} else {\r\n\t\t\t\t\tcancelTextVal = \"取消\"\r\n\t\t\t\t}\r\n\r\n\t\t\t\tlet confirmTextVal = '确定'\r\n\t\t\t\tlet confirmColorVal = ''\r\n\t\t\t\tif (this.confirmTextSelect) {\r\n\t\t\t\t\tconfirmTextVal = \"修改后的确定文本\"\r\n\t\t\t\t\tconfirmColorVal = \"#00ffff\"\r\n\t\t\t\t}\r\n\r\n\t\t\t\tlet placeholderTextVal = ''\r\n\t\t\t\tlet contentVal = \"弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内\"\r\n\t\t\t\tif (this.placeholderTextSelect) {\r\n\t\t\t\t\tplaceholderTextVal = \"定制提示信息\"\r\n\t\t\t\t\tcontentVal = \"\"\r\n\t\t\t\t}\r\n\t\t\t\tuni.showModal({\r\n\t\t\t\t\ttitle: this.items[this.current].value,\r\n\t\t\t\t\teditable: this.editableSelect,\r\n\t\t\t\t\tplaceholderText: placeholderTextVal,\r\n\t\t\t\t\tcontent: contentVal,\r\n\t\t\t\t\tshowCancel: this.showCancelSelect,\r\n\t\t\t\t\tcancelText: cancelTextVal,\r\n\t\t\t\t\tcancelColor: cancelColorVal,\r\n\t\t\t\t\tconfirmText: confirmTextVal,\r\n\t\t\t\t\tconfirmColor: confirmColorVal,\r\n\t\t\t\t\tsuccess: function (res) {\r\n\t\t\t\t\t\tthis.exeRet = JSON.stringify(res)\r\n\t\t\t\t\t},\r\n\t\t\t\t\tfail: function (res) {\r\n\t\t\t\t\t\tthis.exeRet = JSON.stringify(res)\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\r\n\t\t\t}\r\n\r\n\t\t}\r\n\t}\r\n</script>\n```"},"showActionSheet":{"name":"## uni.showActionSheet(options) @showactionsheet","description":"从底部向上弹出操作菜单","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ShowActionSheetOptions](#showactionsheetoptions-values) | 是 | - |  uni.showActionSheet函数参数定义 |\n#### ShowActionSheetOptions 属性值 @showactionsheetoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| title | string | 否 | - |  菜单标题 |\n| alertText | string | 否 | - |  警示文案（同菜单标题, app无效） |\n| itemList | Array\\<string\\> | 是 | - | - |\n| itemColor | string | 否 | - |  按钮的文字颜色，字符串格式（iOS默认为系统控件颜色） |\n| popover | [Popover](#popover-values) | 否 | - |  大屏设备弹出原生选择按钮框的指示区域，默认居中显示 |\n| success | (res: [ShowActionSheetSuccess](#showactionsheetsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### Popover 属性值 @popover-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| top | number | 是 | - |  指示区域坐标，使用原生 navigationBar 时一般需要加上 navigationBar 的高度 |\n| left | number | 是 | - |  指示区域坐标 |\n| width | number | 是 | - |  指示区域宽度 |\n| height | number | 是 | - |  指示区域高度 |\n\n##### ShowActionSheetSuccess 属性值 @showactionsheetsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tapIndex | number | 否 | - |  用户点击的按钮，从上到下的顺序，从0开始 |\n","returnValue":"","compatibility":"### showActionSheet 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[showActionSheet]([](https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet))\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/action-sheet/action-sheet.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-list\">\r\n      <radio-group @change=\"radioChange\">\r\n        <radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\r\n          :class=\"index < items.length - 1 ? 'uni-list-cell-line': ''\" :value=\"item.value\" :checked=\"index === current\">\r\n          {{item.name}}\r\n        </radio>\r\n      </radio-group>\r\n    </view>\r\n    <view class=\"uni-list\">\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">自定义itemColor</view>\r\n        <switch :checked=\"itemColorCustom\" @change=\"itemColorChange\" />\r\n      </view>\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">超长文本和空文本item</view>\r\n        <switch :checked=\"itemContentLarge\" @change=\"itemContentLargeChange\" />\r\n      </view>\r\n      <view class=\"uni-list-cell uni-list-cell-pd\">\r\n        <view class=\"uni-list-cell-db\">超过6个item</view>\r\n        <switch :checked=\"itemNumLargeSelect\" @change=\"itemNumLargeChange\" />\r\n      </view>\r\n    </view>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <button class=\"uni-btn-v\" type=\"default\" @tap=\"actionSheetTap\">弹出action sheet</button>\r\n      </view>\r\n    </view>\r\n  </view>\r\n</template>\r\n<script lang=\"uts\">\r\n  type ItemType = {\r\n    value : string,\r\n    name : string,\r\n  }\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'action-sheet',\r\n        itemColorCustom: false,\r\n        itemContentLarge: false,\r\n        itemNumLargeSelect: false,\r\n        items: [{\r\n          value: '标题',\r\n          name: '有标题'\r\n        },\r\n        {\r\n          value: '',\r\n          name: '无标题'\r\n        },\r\n        {\r\n          value: '超长标题测试内容，测试超过显示最大范围之后的样式-超长标题测试内容，测试超过显示最大范围之后的样式',\r\n          name: '超长标题'\r\n        }\r\n        ] as ItemType[],\r\n        current: 0,\r\n      }\r\n    },\r\n    methods: {\r\n      radioChange(e : RadioGroupChangeEvent) {\r\n        for (let i = 0; i < this.items.length; i++) {\r\n          if (this.items[i].value === e.detail.value) {\r\n            this.current = i;\r\n            break;\r\n          }\r\n        }\r\n      },\r\n      itemContentLargeChange: function (e : SwitchChangeEvent) {\r\n        this.itemContentLarge = e.detail.value\r\n      },\r\n      itemColorChange: function (e : SwitchChangeEvent) {\r\n        this.itemColorCustom = e.detail.value\r\n      },\r\n      itemNumLargeChange: function (e : SwitchChangeEvent) {\r\n        this.itemNumLargeSelect = e.detail.value\r\n      },\r\n      actionSheetTap() {\r\n\r\n        let itemInfo = ['item1', 'item2', 'item3', 'item4']\r\n\r\n        if (this.itemContentLarge) {\r\n          itemInfo = ['两个黄鹂鸣翠柳，一行白鹭上青天。窗含西岭千秋雪，门泊东吴万里船', '水光潋滟晴方好,山色空蒙雨亦奇。 欲把西湖比西子,淡妆浓抹总相宜', '']\r\n        } \n        \n        if (this.itemNumLargeSelect) {\r\n          // 大量选项测试,不能超过6个元素 https://uniapp.dcloud.net.cn/api/ui/prompt.html#showactionsheet\r\n          itemInfo = []\n          for (var i = 1; i <= 10; i++) {\r\n            itemInfo.push('两个黄鹂鸣翠柳，一行白鹭上青天');\r\n          }\r\n        }\r\n\r\n        const that = this\r\n        if (this.itemColorCustom) {\r\n          uni.showActionSheet({\r\n            title: this.items[this.current].value,\r\n            itemList: itemInfo,\r\n            itemColor: \"#ff00ff\",\r\n            success: (e) => {\r\n              console.log(e.tapIndex);\r\n              uni.showToast({\r\n                title: \"点击了第\" + e.tapIndex + \"个选项\",\r\n                icon: \"none\"\r\n              })\r\n            },\r\n            fail: (e) => {\r\n              console.log(e);\r\n            }\r\n          })\r\n        } else {\r\n          uni.showActionSheet({\r\n            title: this.items[this.current].value,\r\n            itemList: itemInfo,\r\n            success: (e) => {\r\n              console.log(e.tapIndex);\r\n              uni.showToast({\r\n                title: \"点击了第\" + e.tapIndex + \"个选项\",\r\n                icon: \"none\"\r\n              })\r\n            },\r\n            fail: (e) => {\r\n              console.log(e);\r\n              uni.showToast({\r\n                title: e.errMsg,\r\n                icon: \"none\"\r\n              })\r\n            }\r\n          })\r\n        }\r\n      },\r\n    }\r\n  }\r\n</script>\n\n```"},"loadFontFace":{"name":"## uni.loadFontFace(options) @loadfontface","description":"\n动态加载网络字体\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [LoadFontFaceOptions](#loadfontfaceoptions-values) | 是 | - | - |\n#### LoadFontFaceOptions 属性值 @loadfontfaceoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| global | boolean | 否 | - |  是否全局生效。微信小程序 '2.10.0'起支持全局生效，需在 app.vue 中调用。 |\n| family | string | 是 | - |  定义的字体名称 |\n| source | string | 是 | - |  字体资源的地址 |\n| success | (result: [AsyncApiSuccessResult](#asyncapisuccessresult-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (error: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: [AsyncApiResult](#asyncapiresult-values)) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### AsyncApiSuccessResult 属性值 @asyncapisuccessresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### AsyncApiResult 属性值 @asyncapiresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### LoadFontFaceOptions 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| global | 5.0 | √ | √ | 10.0 | √ | x |\n| family | 5.0 | √ | √ | 10.0 | √ | x |\n| source | 5.0 | √ | √ | 10.0 | √ | x |\n| success | 5.0 | √ | √ | 10.0 | √ | x |\n| fail | 5.0 | √ | √ | 10.0 | √ | x |\n| complete | 5.0 | √ | √ | 10.0 | √ | x |\n","returnValue":"","compatibility":"### loadFontFace 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 5.0 | √ | √ | 10.0 | √ | x |\n","tutorial":"\n### 参见\n[loadFontFace](http://uniapp.dcloud.io/api/ui/font?id=loadfontface)\n"},"load-font-face":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/load-font-face/load-font-face.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"loadFontFace\"></page-head>\n    <view class=\"uni-padding-wrap\">\n      <text class=\"font-size-20\">全局加载字体：</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: UniFontFamily\">font-family: uni.ttf</text>\n      <view style=\"flex-direction: row;\">\n        <text class=\"font-size-20\" style=\"font-family: UniFontFamily;\">{{\n          uniIcon1\n        }}</text>\n        <text style=\"margin-left:5px;margin-right: 20px;line-height:22px;\">\\ue100</text>\n        <text class=\"font-size-20\" style=\"font-family: UniFontFamily;\">{{\n          uniIcon2\n        }}</text>\n        <text style=\"margin-left:5px;line-height:22px;\">\\ue101</text>\n      </view>\n      <text class=\"uni-common-mt font-size-20\">非全局加载字体：</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: AlimamaDaoLiTiTTF\">font-family: 阿里妈妈刀隶体-ttf\n        (网络字体下载后生效)</text>\n      <text class=\"font-size-20 line-height-40\" style=\"font-family: AlimamaDaoLiTiOTF\">font-family:\n        阿里妈妈刀隶体-otf</text>\n      <text class=\"item\" style=\"font-family: AlimamaDaoLiTiWOFF\">font-family: 阿里妈妈刀隶体-woff</text>\n      <text class=\"item\" style=\"font-family: AlimamaDaoLiTiWOFF2\">font-family: 阿里妈妈刀隶体-woff2</text>\n      <button class=\"uni-btn\" @click=\"navigateToChild\">跳转子页面测试字体生效范围</button>\n    </view>\n  </view>\n</template>\n<script>\n  export default {\n    data() {\n      return {\n        uniIcon1: '\\ue100',\n        uniIcon2: '\\ue101',\n      }\n    },\n    onLoad() {\n      uni.loadFontFace({\n        global: true,\n        family: 'UniFontFamily',\n        source: '/static/font/uni.ttf',\n        success() {\n          console.log('global loadFontFace uni.ttf success')\n        },\n        fail(error) {\n          console.warn('global loadFontFace uni.ttf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiTTF',\n        source:\n          'https://native-res.dcloud.net.cn/uni-app-x/static/font/AlimamaDaoLiTi.ttf',\n        success() {\n          console.log('loadFontFace Remote AlimamaDaoLiTi.ttf success')\n        },\n        fail(error) {\n          console.warn('loadFontFace Remote AlimamaDaoLiTi.ttf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiOTF',\n        source: '/static/font/AlimamaDaoLiTi.otf',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.otf success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.otf fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiWOFF',\n        source: '/static/font/AlimamaDaoLiTi.woff',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.woff success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.woff fail', error.errMsg)\n        },\n      })\n      uni.loadFontFace({\n        family: 'AlimamaDaoLiTiWOFF2',\n        source: '/static/font/AlimamaDaoLiTi.woff2',\n        success() {\n          console.log('loadFontFace AlimamaDaoLiTi.woff2 success')\n        },\n        fail(error) {\n          console.warn('loadFontFace AlimamaDaoLiTi.woff2 fail', error.errMsg)\n        },\n      })\n    },\n    methods: {\n      navigateToChild() {\n        uni.navigateTo({\n          url: '/pages/API/load-font-face/load-font-face-child',\n        })\n      },\n    },\n  }\n</script>\n\n<style>\n  .font-size-20 {\n    font-size: 20px;\n  }\n\n  .line-height-40 {\n    line-height: 40px;\n  }\n</style>\n```"},"request":{"name":"## uni.request(param) @request","description":"发起网络请求。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| param | [RequestOptions\\<T>](#requestoptions-values) | 是 | - |  网络请求参数 |\n#### RequestOptions\\<T> 属性值 @requestoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器接口地址 |\n| data | any | 否 | null |  请求的参数 Object\\|String类型 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  设置请求的 header，header 中不能设置 Referer |\n| method | RequestMethod | 否 | \"GET\" |  请求类型 默认值GET\t GET\\|POST\\|PUT\\|DELETE\\|HEAD\\|OPTIONS |\n| timeout | number | 否 | 60000 |  超时时间，单位 ms |\n| dataType | string | 否 | \"json\" |  如果设为 json，会对返回的数据进行一次 JSON.parse，非 json 不会进行 JSON.parse |\n| responseType | string | 否 | - |  设置响应的数据类型。  |\n| sslVerify | boolean | 否 | - |  验证 ssl 证书  |\n| firstIpv4 | boolean | 否 | false |  DNS解析时优先使用ipv4 |\n| success | (option: [RequestSuccess\\<T>](#requestsuccess-values)) => void | 否 | null |  网络请求成功回调。 |\n| fail | (option: [RequestFail](#requestfail-values)) => void | 否 | null |  网络请求失败回调。 |\n| complete | (option: any) => void | 否 | null |  网络请求完成回调，成功或者失败都会调用。 |\n\n##### RequestSuccess\\<T> 属性值 @requestsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 否 | - |  开发者服务器返回的数据 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n| header | any | 是 | - |  开发者服务器返回的 HTTP Response Header |\n| cookies | Array\\<string\\> | 是 | - | - |\n\n##### RequestFail 属性值 @requestfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [RequestTask](#requesttask-values) | 否 | \n\n#### RequestTask 属性值 @requesttask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断网络请求。 |\n\n##### RequestTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","compatibility":"### request 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[request](https://uniapp.dcloud.net.cn/api/request/request.html)\n","example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/request/request.uvue) \n ```html\n<template>\r\n  <view style=\"flex: 1;\">\r\n    <view class=\"uni-padding-wrap uni-common-mt\">\r\n      <view class=\"uni-common-mt\" style=\"border-width: 2rpx;border-radius: 4rpx;\">\r\n        <textarea :value=\"res\" class=\"uni-textarea\"></textarea>\r\n      </view>\r\n      <view>\r\n        <text>地址 : {{ host + url}}</text>\r\n        <text>请求方式 : {{method}}</text>\r\n      </view>\r\n      <view class=\"uni-btn-v uni-common-mt\">\r\n        <button type=\"primary\" @click=\"sendRequest\">发起请求</button>\r\n      </view>\r\n    </view>\r\n    <scroll-view style=\"flex: 1;\" show-scrollbar=\"true\">\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>设置请求方式</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('GET')\">GET</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('POST')\">POST</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('PUT')\">PUT</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('DELETE')\">DELETE</button>\r\n          <button style=\"padding: 5rpx; margin-right: 10rpx; \" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('PATCH')\">PATCH</button>\r\n          <button style=\"padding: 5rpx;margin-right: 10rpx;\" type=\"primary\" size=\"mini\"\r\n            @click=\"changeMethod('OPTIONS')\">OPTIONS</button>\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" @click=\"changeMethod('HEAD')\">HEAD</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求返回错误码的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in errorCodeUrls\" :key=\"index\"\r\n            @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求不同header的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in headerUrls\" :key=\"index\"\r\n            @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>请求不同content-type的接口（默认为GET）</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in contentTypeUrls\"\r\n            :key=\"index\" @click=\"changeUrl(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n\r\n      <view style=\"padding: 20rpx;\">\r\n        <text>POST请求(有body)</text>\r\n        <view class=\"uni-common-pb\"></view>\r\n        <view style=\"flex-direction: row;flex-wrap: wrap;\">\r\n          <button style=\"padding: 5rpx;\" type=\"primary\" size=\"mini\" v-for=\"(item, index) in postUrls\" :key=\"index\"\r\n            @click=\"changeUrlFromPost(item)\">{{item}}</button>\r\n        </view>\r\n      </view>\r\n    </scroll-view>\r\n  </view>\r\n</template>\r\n<script>\r\n  const duration = 2000\r\n  const methodMap = {\r\n    \"GET\": \"/api/http/method/get\",\r\n    \"POST\": \"/api/http/method/post\",\r\n    \"PUT\": \"/api/http/method/put\",\r\n    \"DELETE\": \"/api/http/method/delete\",\r\n    \"PATCH\": \"/api/http/method/patch\",\r\n    \"OPTIONS\": \"/api/http/method/options\",\r\n    \"HEAD\": \"/api/http/method/head\"\r\n  }\r\n\r\n\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'request',\r\n        res: '',\r\n        task: null as RequestTask | null,\r\n        pageVisible: false,\r\n        host: \"http://request.dcloud.net.cn\",\r\n        url: \"/api/http/method/get\",\r\n        method: \"GET\" as RequestMethod | null,\r\n        data: null as any | null,\r\n        header: null as UTSJSONObject | null,\r\n        errorCodeUrls: [\r\n          \"/api/http/statusCode/200\",\r\n          \"/api/http/statusCode/204\",\r\n          \"/api/http/statusCode/301\",\r\n          \"/api/http/statusCode/302\",\r\n          \"/api/http/statusCode/307\",\r\n          \"/api/http/statusCode/400\",\r\n          \"/api/http/statusCode/401\",\r\n          \"/api/http/statusCode/403\",\r\n          \"/api/http/statusCode/404\",\r\n          \"/api/http/statusCode/405\",\r\n          \"/api/http/statusCode/500\",\r\n          \"/api/http/statusCode/502\",\r\n          \"/api/http/statusCode/503\",\r\n          \"/api/http/statusCode/504\",\r\n        ],\r\n        headerUrls: [\r\n          \"/api/http/header/ua\",\r\n          \"/api/http/header/referer\",\r\n          \"/api/http/header/requestCookie\",\r\n          \"/api/http/header/setCookie\",\r\n          \"/api/http/header/deleteCookie\"\r\n        ],\r\n        contentTypeUrls: [\r\n          \"/api/http/contentType/text/plain\",\r\n          \"/api/http/contentType/text/html\",\r\n          \"/api/http/contentType/text/xml\",\r\n          \"/api/http/contentType/image/gif\",\r\n          \"/api/http/contentType/image/jpeg\",\r\n          \"/api/http/contentType/image/png\",\r\n          \"/api/http/contentType/application/json\",\r\n          \"/api/http/contentType/application/octetStream\",\r\n        ],\r\n        postUrls: [\r\n          \"/api/http/contentType/json\",\r\n          \"/api/http/contentType/xWwwFormUrlencoded\",\r\n        ],\r\n        //自动化测试例专用\r\n        jest_result: false\r\n      }\r\n    },\r\n    onLoad() {\r\n      this.pageVisible = true;\r\n    },\r\n    onUnload() {\r\n      this.pageVisible = false;\r\n      uni.hideLoading();\r\n      this.task?.abort();\r\n    },\r\n    methods: {\r\n      changeMethod(e : RequestMethod) {\r\n        this.method = e;\r\n        this.url = methodMap[e] as string;\r\n        this.data = null;\r\n        this.header = null;\r\n      },\r\n      changeUrl(e : string) {\r\n        this.method = \"GET\";\r\n        this.url = e;\r\n        this.data = null;\r\n        this.header = null;\r\n      },\r\n      changeUrlFromPost(e : string) {\r\n        this.method = \"POST\";\r\n        this.url = e;\r\n        switch (e) {\r\n          case \"/api/http/contentType/json\":\r\n            this.header = {\r\n              \"Content-Type\": \"application/json\"\r\n            };\r\n            this.data = {\r\n              \"hello\": \"world\"\r\n            };\r\n            break;\r\n          case \"/api/http/contentType/xWwwFormUrlencoded\":\r\n            this.header = {\r\n              \"Content-Type\": \"application/x-www-form-urlencoded\"\r\n            };\r\n            this.data = \"hello=world\";\r\n            break;\r\n        }\r\n      },\r\n      sendRequest() {\r\n        uni.showLoading({\r\n          title: \"请求中...\"\r\n        })\r\n        this.task = uni.request({\r\n          url: this.host + this.url,\r\n          // dataType: \"json\",\r\n          // responseType: \"json\",\r\n          method: this.method,\r\n          data: this.data,\r\n          header: this.header,\r\n          timeout: 6000,\r\n          sslVerify: false,\r\n          withCredentials: false,\r\n          firstIpv4: false,\r\n          success(res) {\r\n            if (this.pageVisible) {\r\n              console.log('request success', JSON.stringify(res.data))\r\n              uni.showToast({\r\n                title: '请求成功',\r\n                icon: 'success',\r\n                mask: true,\r\n                duration: duration\r\n              });\r\n              this.res = '请求结果 : ' + JSON.stringify(res);\r\n            }\r\n          },\r\n          fail(err) {\r\n            if (this.pageVisible) {\r\n              console.log('request fail', err);\r\n              uni.showModal({\r\n                content: err.errMsg,\r\n                showCancel: false\r\n              });\r\n            }\r\n          },\r\n          complete() {\r\n            uni.hideLoading()\r\n          },\r\n        });\r\n      },\r\n      //自动化测试例专用\r\n      jest_request() {\r\n        uni.request({\r\n          url: this.host + this.url,\r\n          // dataType: \"json\",\r\n          // responseType: \"json\",\r\n          method: this.method,\r\n          data: this.data,\r\n          header: this.header,\r\n          timeout: 6000,\r\n          sslVerify: false,\r\n          withCredentials: false,\r\n          firstIpv4: false,\r\n          success() {\r\n            this.jest_result = true;\r\n          },\r\n          fail() {\r\n            this.jest_result = false;\r\n          },\r\n        });\r\n      }\r\n    }\r\n  }\r\n</script>\n\n```"},"uploadFile":{"name":"## uni.uploadFile(options) @uploadfile","description":"将本地资源上传到开发者服务器。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [UploadFileOptions](#uploadfileoptions-values) | 是 | - | - |\n#### UploadFileOptions 属性值 @uploadfileoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器 url |\n| filePath | string | 否 | null |  要上传文件资源的路径 |\n| name | string | 否 | null |  文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容 |\n| files | Array\\<[UploadFileOptionFiles](#uploadfileoptionfiles-values)\\> | 否 | null |  需要上传的文件列表。 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header, header 中不能设置 Referer |\n| formData | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求中其他额外的 form data |\n| timeout | number | 否 | 120000 |  超时时间，单位 ms |\n| success | (result: [UploadFileSuccess](#uploadfilesuccess-values)) => void | 否 | null |  成功返回的回调函数 |\n| fail | (result: [UploadFileFail](#uploadfilefail-values)) => void | 否 | null |  失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  结束的回调函数（调用成功、失败都会执行） |\n\n##### UploadFileOptionFiles 属性值 @uploadfileoptionfiles-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| name | string | 否 | \"file\" |  multipart 提交时，表单的项目名，默认为 file，如果 name 不填或填的值相同，可能导致服务端读取文件时只能读取到一个文件。 |\n| uri | string | 是 | - |  要上传文件资源的路径 |\n\n##### UploadFileSuccess 属性值 @uploadfilesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | string | 是 | - |  开发者服务器返回的数据 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n\n##### UploadFileFail 属性值 @uploadfilefail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [UploadTask](#uploadtask-values) | 否 | \n\n#### UploadTask 属性值 @uploadtask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断上传任务。 |\n| onProgressUpdate | (callback: (result: [OnProgressUpdateResult](#onprogressupdateresult-values)) => void) => void | 是 | - | 监听上传进度变化。 |\n\n##### OnProgressUpdateResult 属性值 @onprogressupdateresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| progress | number | 是 | - |  上传进度百分比 |\n| totalBytesSent | number | 是 | - |  已经上传的数据长度，单位 Bytes |\n| totalBytesExpectedToSend | number | 是 | - |  预期需要上传的数据总长度，单位 Bytes |\n\n##### UploadTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onProgressUpdate | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","compatibility":"### uploadFile 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[uploadFile](https://uniapp.dcloud.net.cn/api/request/network-file.html#uploadfile)\n"},"upload-file":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/upload-file/upload-file.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"demo\">\r\n          <image\r\n            v-if=\"imageSrc\"\r\n            :src=\"imageSrc\"\r\n            class=\"image\"\r\n            mode=\"widthFix\"\r\n          ></image>\r\n          <text v-else class=\"uni-hello-addfile\" @click=\"chooseImage\"\r\n            >+ 选择图片</text\r\n          >\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'uploadFile',\r\n\t\t\timageSrc: '',\r\n\t\t\ttask: null as UploadTask | null,\r\n\t\t\tpageVisible: false,\n      //自动化测试例专用\n      jest_result:false,\r\n\t\t}\r\n\t},\r\n\tonLoad() {\r\n\t\tthis.pageVisible = true;\r\n\t},\r\n\tonUnload() {\r\n\t\tthis.imageSrc = '';\r\n\t\tthis.pageVisible = false;\r\n\t\tuni.hideLoading();\r\n\t\tthis.task?.abort();\r\n\t},\r\n\tmethods: {\r\n\t\tchooseImage: function() {\r\n\t\t\tuni.chooseImage({\r\n\t\t\t\tcount: 1,\r\n\t\t\t\tsizeType: ['compressed'],\r\n\t\t\t\tsourceType: ['album'],\r\n\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\tconsole.log('chooseImage success, temp path is', res.tempFilePaths[0])\r\n\t\t\t\t\tvar imageSrc = res.tempFilePaths[0]\r\n\t\t\t\t\tuni.showLoading({\r\n\t\t\t\t\t\ttitle: '上传中'\r\n\t\t\t\t\t})\n\t\t\t\t\tthis.task = uni.uploadFile({\r\n\t\t\t\t\t\turl: 'https://unidemo.dcloud.net.cn/upload', //仅为示例，非真实的接口地址\r\n\t\t\t\t\t\tfilePath: imageSrc,\r\n\t\t\t\t\t\tname: 'file',\r\n\t\t\t\t\t\tformData: {\r\n\t\t\t\t\t\t\t'user': 'test'\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\t\tconsole.log('uploadImage success, res is:', res)\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t\tuni.showToast({\r\n\t\t\t\t\t\t\t\t\ttitle: '上传成功',\r\n\t\t\t\t\t\t\t\t\ticon: 'success',\r\n\t\t\t\t\t\t\t\t\tduration: 1000\r\n\t\t\t\t\t\t\t\t})\r\n\t\t\t\t\t\t\t\tthis.imageSrc = imageSrc\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t\tfail: (err) => {\r\n\t\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\t\tconsole.log('uploadImage fail', err);\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t\tuni.showModal({\r\n\t\t\t\t\t\t\t\t\tcontent: err.errMsg,\r\n\t\t\t\t\t\t\t\t\tshowCancel: false\r\n\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t});\r\n\t\t\t\t},\r\n\t\t\t\tfail: (err) => {\r\n\t\t\t\t\tconsole.log('chooseImage fail', err)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t},\n    //自动化测试例专用\n    jest_uploadFile(){\n      const imageSrc = \"/static/uni.png\";\n      this.task = uni.uploadFile({\n      \turl: 'https://unidemo.dcloud.net.cn/upload', //仅为示例，非真实的接口地址\n      \tfilePath: imageSrc,\n      \tname: 'file',\n      \tformData: {\n      \t\t'user': 'test'\n      \t},\n      \tsuccess: () => {\n          this.jest_result = true;\n      \t},\n      \tfail: () => {\n          this.jest_result = false;\n      \t},\n      })\n    }\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.image {\r\n  width: 100%;\r\n}\r\n\r\n.demo {\r\n  background: #fff;\r\n  padding: 50rpx;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.uni-hello-addfile {\r\n  text-align: center;\r\n  background: #fff;\r\n  padding: 50rpx;\r\n  margin-top: 10px;\r\n  font-size: 38rpx;\r\n  color: #808080;\r\n}\r\n</style>\r\n\n```"},"downloadFile":{"name":"## uni.downloadFile(options) @downloadfile","description":"下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [DownloadFileOptions](#downloadfileoptions-values) | 是 | - | - |\n#### DownloadFileOptions 属性值 @downloadfileoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  下载资源的 url |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header，header 中不能设置 Referer |\n| timeout | number | 否 | 120000 |  超时时间，单位 ms |\n| success | (result: [DownloadFileSuccess](#downloadfilesuccess-values)) => void | 否 | null |  下载成功后以 tempFilePath 的形式传给页面，res = {tempFilePath: '文件的临时路径'} |\n| fail | (result: [DownloadFileFail](#downloadfilefail-values)) => void | 否 | null |  失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  结束的回调函数（调用成功、失败都会执行） |\n\n##### DownloadFileSuccess 属性值 @downloadfilesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tempFilePath | string | 是 | - |  临时文件路径，下载后的文件会存储到一个临时文件 |\n| statusCode | number | 是 | - |  开发者服务器返回的 HTTP 状态码 |\n\n##### DownloadFileFail 属性值 @downloadfilefail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | RequestErrorCode | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [DownloadTask](#downloadtask-values) | 否 | \n\n#### DownloadTask 属性值 @downloadtask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| abort | () => void | 是 | - | 中断下载任务。 |\n| onProgressUpdate | (callback: (result: [OnProgressDownloadResult](#onprogressdownloadresult-values)) => void) => void | 是 | - | 监听下载进度变化。 |\n\n##### OnProgressDownloadResult 属性值 @onprogressdownloadresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| progress | number | 是 | - |  下载进度百分比 |\n| totalBytesWritten | number | 是 | - |  已经下载的数据长度，单位 Bytes |\n| totalBytesExpectedToWrite | number | 是 | - |  预期需要下载的数据总长度，单位 Bytes |\n\n##### DownloadTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| abort | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onProgressUpdate | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","compatibility":"### downloadFile 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[downloadFile](https://uniapp.dcloud.net.cn/api/request/network-file.html#downloadfile)\n"},"download-file":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/download-file/download-file.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view v-if=\"imageSrc\" class=\"image-container\">\r\n          <image class=\"img\" :src=\"imageSrc\" mode=\"center\" />\r\n        </view>\r\n        <view v-else style=\"margin-top: 50px\">\r\n          <text class=\"uni-hello-text\">点击按钮下载服务端示例图片（下载网络文件到本地临时目录）</text>\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"downloadImage\">下载</button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'downloadFile',\r\n\t\t\timageSrc: '',\r\n\t\t\ttask: null as DownloadTask | null,\r\n\t\t\tpageVisible: false,\n      //自动化测试例专用\n      jest_result: false\r\n\t\t}\r\n\t},\r\n\tonLoad() {\r\n\t\tthis.pageVisible = true;\r\n\t},\r\n\tonUnload() {\r\n\t\tthis.imageSrc = '';\r\n\t\tthis.pageVisible = false;\r\n\t\tuni.hideLoading();\r\n\t\tthis.task?.abort();\r\n\t},\r\n\tmethods: {\r\n\t\tdownloadImage: function() {\r\n\t\t\tuni.showLoading({\r\n\t\t\t\ttitle: '下载中'\r\n\t\t\t})\r\n\t\t\tvar self = this\r\n\t\t\tthis.task = uni.downloadFile({\r\n\t\t\t\turl: \"https://web-assets.dcloud.net.cn/unidoc/zh/uni-app.png\",\r\n\t\t\t\tsuccess(res) {\r\n\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\tconsole.log('downloadFile success, res is', res)\r\n\t\t\t\t\t\tself.imageSrc = res.tempFilePath;\r\n\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\tfail: (err) => {\r\n\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\tconsole.log('downloadFile fail, err is:', err)\r\n\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t\tthis.task?.onProgressUpdate((update) => {\r\n\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\tconsole.log(\"progress : \", update.progress);\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t},\n    //自动化测试例专用\n    jest_downloadFile(){\n      uni.downloadFile({\n      \turl: \"https://web-assets.dcloud.net.cn/unidoc/zh/uni-app.png\",\n      \tsuccess() {\n          this.jest_result = true\n      \t},\n      \tfail: () => {\n          this.jest_result = false\n      \t}\n      });\r\n    }\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.img {\r\n  width: 500rpx;\r\n  height: 500rpx;\r\n  margin: 0 auto;\r\n}\r\n\r\n.image-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n</style>\r\n\n```"},"getNetworkType":{"name":"## uni.getNetworkType(options) @getnetworktype","description":"获取网络类型","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetNetworkTypeOptions](#getnetworktypeoptions-values) | 是 | - | - |\n#### GetNetworkTypeOptions 属性值 @getnetworktypeoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [GetNetworkTypeSuccess](#getnetworktypesuccess-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetNetworkTypeSuccess 属性值 @getnetworktypesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| networkType | string | 是 | - |  网络类型 |\n","returnValue":"","compatibility":"### getNetworkType 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getNetworkType](http://uniapp.dcloud.io/api/system/network?id=getnetworktype)\n"},"get-network-type":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-network-type/get-network-type.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t<view style=\"background:#FFFFFF; padding:40rpx;\">\r\n\t\t\t\t<view class=\"uni-center\">网络状态</view>\r\n\t\t\t\t<view v-if=\"hasNetworkType == false\">\r\n\t\t\t\t\t<view class=\"uni-h2 uni-center uni-common-mt\">未获取</view>\r\n\t\t\t\t\t<view class=\"uni-center uni-common-mt\">请点击下面按钮获取网络状态</view>\r\n\t\t\t\t</view>\r\n\t\t\t\t<view v-if=\"hasNetworkType == true\">\r\n\t\t\t\t\t<view class=\"uni-h2 uni-center uni-common-mt\">{{networkType}}</view>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v uni-common-mt\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"getNetworkType\">获取设备网络状态</button>\r\n\t\t\t\t<button class=\"uni-common-mt\" @tap=\"clear\">清空</button>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getNetworkType',\r\n\t\t\t\thasNetworkType: false,\r\n\t\t\t\tnetworkType: '',\r\n\t\t\t\tconnectedWifi: '',\r\n\t\t\t\tpageVisible: false,\n        //自动化测试例专用\n        jest_result:false,\r\n\t\t\t}\r\n\t\t},\r\n\t\tonLoad() {\r\n\t\t\tthis.pageVisible = true;\r\n\t\t},\r\n\t\tonUnload: function() {\r\n\t\t\tthis.pageVisible = false;\r\n\t\t\tthis.networkType = '';\r\n\t\t\tthis.hasNetworkType = false;\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetNetworkType: function() {\r\n\t\t\t\tuni.getNetworkType({\r\n\t\t\t\t\tsuccess: (res) => {\r\n\t\t\t\t\t\tconsole.log(res)\r\n\t\t\t\t\t\tthis.hasNetworkType = true;\r\n\t\t\t\t\t\tthis.networkType = res.networkType\r\n\t\t\t\t\t},\r\n\t\t\t\t\tfail: () => {\r\n\t\t\t\t\t\tif (this.pageVisible) {\r\n\t\t\t\t\t\t\tuni.showModal({\r\n\t\t\t\t\t\t\t\tcontent: '获取失败！',\r\n\t\t\t\t\t\t\t\tshowCancel: false\r\n\t\t\t\t\t\t\t})\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t})\r\n\t\t\t},\r\n\t\t\tclear: function() {\r\n\t\t\t\tthis.hasNetworkType = false;\r\n\t\t\t\tthis.networkType = '';\r\n\t\t\t\tthis.connectedWifi = '';\r\n\t\t\t},\n      //自动化测试例专用\n      jest_getNetworkType(){\n        uni.getNetworkType({\n        \tsuccess: () => {\n            this.jest_result = true;\n        \t},\n        \tfail: () => {\n            this.jest_result = false;\n        \t}\n        })\n      }\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\r\n</style>\n\n```"},"connectSocket":{"name":"## uni.connectSocket(options) @connectsocket","description":"创建一个 WebSocket 连接。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ConnectSocketOptions](#connectsocketoptions-values) | 是 | - | - |\n#### ConnectSocketOptions 属性值 @connectsocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| url | string | 是 | - |  开发者服务器接口地址，必须是 wss 协议，且域名必须是后台配置的合法域名 |\n| header | [UTSJSONObject](/uts/buildin-object-api/utsjsonobject.md) | 否 | null |  HTTP 请求 Header，header 中不能设置 Referer |\n| protocols | Array\\<string\\> | 否 | null |  子协议数组 |\n| success | (result: [ConnectSocketSuccess](#connectsocketsuccess-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [ConnectSocketFail](#connectsocketfail-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ConnectSocketSuccess 属性值 @connectsocketsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - | - |\n\n##### ConnectSocketFail 属性值 @connectsocketfail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errCode | 600009 | 是 | - | - |\n| errSubject | string | 是 | - |  统一错误主题（模块）名称 |\n| data | any | 否 | - |  错误信息中包含的数据 |\n| cause | [Error](/tutorial/err-spec.html#unierror) | 否 | - |  源错误信息，可以包含多个错误，详见SourceError |\n| errMsg | string | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [SocketTask](#sockettask-values) | \n\n#### SocketTask 属性值 @sockettask-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| send | (options: [SendSocketMessageOptions](#sendsocketmessageoptions-values)) => void | 是 | - | 通过 WebSocket 连接发送数据 |\n| close | (options: [CloseSocketOptions](#closesocketoptions-values)) => void | 是 | - | 关闭 WebSocket 连接 |\n| onOpen | (callback: (result: [OnSocketOpenCallbackResult](#onsocketopencallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 连接打开事件 |\n| onClose | (callback: (result: any) => void) => void | 是 | - | 监听 WebSocket 连接关闭事件 |\n| onError | (callback: (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 错误 |\n| onMessage | (callback: (result: [OnSocketMessageCallbackResult](#onsocketmessagecallbackresult-values)) => void) => void | 是 | - | 监听 WebSocket 接受到服务器的消息事件 |\n\n##### SendSocketMessageOptions 属性值 @sendsocketmessageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  需要发送的内容 |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### CloseSocketOptions 属性值 @closesocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 否 | 1000 |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。如果这个参数没有被指定，默认的取值是1000 （表示正常连接关闭） |\n| reason | string | 否 | \"\" |  一个可读的字符串，表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本（不是字符） |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### OnSocketOpenCallbackResult 属性值 @onsocketopencallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| header | any | 是 | - |  连接成功的 HTTP 响应 Header |\n\n##### OnSocketMessageCallbackResult 属性值 @onsocketmessagecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  服务器返回的消息 |\n\n##### SocketTask 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| send | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| close | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onOpen | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onClose | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onError | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n| onMessage | 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","compatibility":"### connectSocket 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[connectSocket](https://uniapp.dcloud.net.cn/api/request/websocket.html#connectsocket)\n"},"onSocketOpen":{"name":"## uni.onSocketOpen(options) @onsocketopen","description":"监听WebSocket连接打开事件。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | (result: [OnSocketOpenCallbackResult](#onsocketopencallbackresult-values)) => void | 是 | - | - |","returnValue":"","compatibility":"### onSocketOpen 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketOpen](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketopen)\n"},"onSocketError":{"name":"## uni.onSocketError(callback) @onsocketerror","description":"下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketErrorCallbackResult](#onsocketerrorcallbackresult-values)) => void | 是 | - | - |\n#### OnSocketErrorCallbackResult 属性值 @onsocketerrorcallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n","returnValue":"","compatibility":"### onSocketError 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketError](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketerror)\n"},"sendSocketMessage":{"name":"## uni.sendSocketMessage(options) @sendsocketmessage","description":"通过 WebSocket 连接发送数据，需要先 uni.connectSocket，并在 uni.onSocketOpen 回调之后才能发送。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SendSocketMessageOptions](#sendsocketmessageoptions-values) | 是 | - | - |\n#### SendSocketMessageOptions 属性值 @sendsocketmessageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  需要发送的内容 |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### sendSocketMessage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[sendSocketMessage](https://uniapp.dcloud.net.cn/api/request/websocket.html#sendsocketmessage)\n"},"onSocketMessage":{"name":"## uni.onSocketMessage(callback) @onsocketmessage","description":"监听WebSocket接受到服务器的消息事件。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketMessageCallbackResult](#onsocketmessagecallbackresult-values)) => void | 是 | - | - |\n#### OnSocketMessageCallbackResult 属性值 @onsocketmessagecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 是 | - |  服务器返回的消息 |\n","returnValue":"","compatibility":"### onSocketMessage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketMessage](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketmessage)\n"},"closeSocket":{"name":"## uni.closeSocket(options) @closesocket","description":"关闭 WebSocket 连接。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [CloseSocketOptions](#closesocketoptions-values) | 是 | - | - |\n#### CloseSocketOptions 属性值 @closesocketoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 否 | 1000 |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。如果这个参数没有被指定，默认的取值是1000 （表示正常连接关闭） |\n| reason | string | 否 | \"\" |  一个可读的字符串，表示连接被关闭的原因。这个字符串必须是不长于123字节的UTF-8 文本（不是字符） |\n| success | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: [GeneralCallbackResult](#generalcallbackresult-values)) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### closeSocket 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[closeSocket](https://uniapp.dcloud.net.cn/api/request/websocket.html#closesocket)\n"},"onSocketClose":{"name":"## uni.onSocketClose(callback) @onsocketclose","description":"监听WebSocket关闭。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| callback | (result: [OnSocketCloseCallbackResult](#onsocketclosecallbackresult-values)) => void | 是 | - | - |\n#### OnSocketCloseCallbackResult 属性值 @onsocketclosecallbackresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| code | number | 是 | - |  一个数字值表示关闭连接的状态号，表示连接被关闭的原因。\t |\n| reason | string | 是 | - |  一个可读的字符串，表示连接被关闭的原因。\t |\n","returnValue":"","compatibility":"### onSocketClose 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[onSocketClose](https://uniapp.dcloud.net.cn/api/request/websocket.html#onsocketclose)\n"},"websocket-global":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/websocket-global/websocket-global.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head title=\"websocket通讯示例\"></page-head>\r\n    <view class=\"uni-padding-wrap\">\r\n      <view class=\"uni-btn-v\">\r\n        <text class=\"websocket-msg\">{{ showMsg }}</text>\r\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"connect\">\r\n          连接websocket服务\r\n        </button>\r\n        <button\r\n          class=\"uni-btn-v\"\r\n          v-show=\"connected\"\r\n          type=\"primary\"\r\n          @click=\"send\"\r\n        >\r\n          发送一条消息\r\n        </button>\r\n        <button class=\"uni-btn-v\" type=\"primary\" @click=\"close\">\r\n          断开websocket服务\r\n        </button>\r\n        <text class=\"websocket-tips\"\r\n          >发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</text\r\n        >\r\n      </view>\r\n    </view>\r\n  </view>\r\n</template>\r\n\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      connected: false,\r\n      connecting: false,\r\n      msg: '',\r\n      roomId: '',\r\n      platform: '',\r\n      pageVisible: false,\r\n    }\r\n  },\r\n  computed: {\r\n    showMsg(): string {\r\n      if (this.connected) {\r\n        if (this.msg.length > 0) {\r\n          return '收到消息：' + this.msg\r\n        } else {\r\n          return '等待接收消息'\r\n        }\r\n      } else {\r\n        return '尚未连接'\r\n      }\r\n    },\r\n  },\r\n  onLoad() {\r\n    this.platform = uni.getSystemInfoSync().platform\r\n    this.pageVisible = true\r\n  },\r\n  onUnload() {\r\n    this.pageVisible = false\r\n    uni.closeSocket({\r\n      code: 1000,\r\n      reason: 'close reason from client',\r\n      success(res: any) {\r\n        console.log('uni.closeSocket success', res)\r\n      },\r\n      fail(err: any) {\r\n        console.log('uni.closeSocket fail', err)\r\n      },\r\n    } as CloseSocketOptions)\r\n    uni.hideLoading()\r\n  },\r\n  methods: {\r\n    connect() {\r\n      if (this.connected || this.connecting) {\r\n        uni.showModal({\r\n          content: '正在连接或者已经连接，请勿重复连接',\r\n          showCancel: false,\r\n        })\r\n        return\r\n      }\r\n      this.connecting = true\r\n      uni.showLoading({\r\n        title: '连接中...',\r\n      })\r\n      uni.connectSocket({\r\n        url: 'ws://websocket.dcloud.net.cn',\r\n        success(res: any) {\r\n          // 这里是接口调用成功的回调，不是连接成功的回调，请注意\r\n          console.log('uni.connectSocket success', res)\r\n        },\r\n        fail(err: any) {\r\n          // 这里是接口调用失败的回调，不是连接失败的回调，请注意\r\n          console.log('uni.connectSocket fail', err)\r\n        },\r\n      })\r\n      uni.onSocketOpen((res) => {\r\n        if (this.pageVisible) {\r\n          this.connecting = false\r\n          this.connected = true\r\n          uni.hideLoading()\r\n\r\n          uni.showToast({\r\n            icon: 'none',\r\n            title: '连接成功',\r\n          })\r\n          console.log('onOpen', res)\r\n        }\r\n      })\r\n      uni.onSocketError((err) => {\r\n        if (this.pageVisible) {\r\n          this.connecting = false\r\n          this.connected = false\r\n          uni.hideLoading()\r\n\r\n          uni.showModal({\r\n            content: '连接失败，可能是websocket服务不可用，请稍后再试',\r\n            showCancel: false,\r\n          })\r\n          console.log('onError', err)\r\n        }\r\n      })\r\n      uni.onSocketMessage((res) => {\r\n        if (this.pageVisible) {\r\n          this.msg = res.data as string\r\n          console.log('onMessage', res)\r\n        }\r\n      })\r\n      uni.onSocketClose((res) => {\r\n        if (this.pageVisible) {\r\n          this.connected = false\r\n          this.msg = ''\r\n          console.log('onClose', res)\r\n        }\r\n      })\r\n    },\r\n    send() {\r\n      uni.sendSocketMessage({\r\n        data:\r\n          'from ' +\r\n          this.platform +\r\n          ' : ' +\r\n          parseInt((Math.random() * 10000).toString()).toString(),\r\n        success(res: any) {\r\n          console.log(res)\r\n        },\r\n        fail(err: any) {\r\n          console.log(err)\r\n        },\r\n      } as SendSocketMessageOptions)\r\n    },\r\n    close() {\r\n      uni.closeSocket({\r\n        code: 1000,\r\n        reason: 'close reason from client',\r\n        success(res: any) {\r\n          console.log('uni.closeSocket success', res)\r\n        },\r\n        fail(err: any) {\r\n          console.log('uni.closeSocket fail', err)\r\n        },\r\n      } as CloseSocketOptions)\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-btn-v {\r\n  padding: 10rpx 0;\r\n}\r\n\r\n.uni-btn-v {\r\n  margin: 20rpx 0;\r\n}\r\n\r\n.websocket-room {\r\n  height: 40px;\r\n  line-height: 40px;\r\n  text-align: center;\r\n  border-bottom: solid 1px #dddddd;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.websocket-msg {\r\n  padding: 40px 0px;\r\n  text-align: center;\r\n  font-size: 14px;\r\n  line-height: 40px;\r\n  color: #666666;\r\n}\r\n\r\n.websocket-tips {\r\n  padding: 40px 0px;\r\n  text-align: center;\r\n  font-size: 14px;\r\n  line-height: 24px;\r\n  color: #666666;\r\n}\r\n</style>\r\n\n```"},"getSystemInfo":{"name":"## uni.getSystemInfo(options) @getsysteminfo","description":"异步获取系统信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetSystemInfoOptions](#getsysteminfooptions-values) | 是 | - | - |\n#### GetSystemInfoOptions 属性值 @getsysteminfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [GetSystemInfoResult](#getsysteminforesult-values)) => void | 否 | null |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | null |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | null |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetSystemInfoResult 属性值 @getsysteminforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| SDKVersion | string | 是 | - |  客户端基础库版本 |\n| appId | string | 是 | - |  `manifest.json` 中应用appid。 |\n| appLanguage | string | 是 | - |  应用设置的语言。 |\n| appName | string | 是 | - |  `manifest.json` 中应用名称（真机运行时，为基座的应用名称）。 |\n| appVersion | string | 是 | - |  `manifest.json` 中应用版本名称（真机运行时，为基座的版本名称）。 |\n| appVersionCode | number | 是 | - |  `manifest.json` 中应用版本名号（真机运行时，为基座的版本号）。 |\n| brand | string | 是 | - |  手机品牌。 |\n| browserName | string | 是 | - |  浏览器名称。`App` 端是系统 webview 的名字，比如 wkwebview、chrome。小程序端为空 |\n| browserVersion | string | 是 | - |  浏览器版本、webview 版本。 |\n| deviceId | string | 是 | - |  设备 ID |\n| deviceBrand | string | 是 | - |  设备品牌。如：`apple`、`huawei`。 |\n| deviceModel | string | 是 | - |  设备型号 |\n| deviceType | string | 是 | - |  设备类型。`phone`、`pad`、`pc` |\n| devicePixelRatio | number | 是 | - |  设备像素比 |\n| deviceOrientation | string | 是 | - |  设备方向。如：`竖屏 portrait`、`横屏 landscape` - portrait: 竖屏 - landscape: 横屏 |\n| language | string | 是 | - |  程序设置的语言 |\n| model | string | 是 | - |  手机型号 |\n| osName | string | 是 | - |  ios、android、windows、mac、linux |\n| osVersion | string | 是 | - |  操作系统版本。如 ios 版本，andriod 版本 |\n| osLanguage | string | 是 | - |  操作系统语言 |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| platform | string | 是 | - |  客户端平台 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| system | string | 是 | - |  操作系统版本 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| ua | string | 是 | - |  用户标识。小程序端为空 |\n| uniCompileVersion | string | 是 | - |  uni 编译器版本 |\n| uniPlatform | string | 是 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 是 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 是 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 是 | - |  uni 运行时版本号 |\n| version | string | 是 | - |  引擎版本号  |\n| romName | string | 是 | - |  rom 名称。Android 部分机型获取不到值。iOS 恒为 `ios` |\n| romVersion | string | 是 | - |  rom 版本号。Android 部分机型获取不到值。iOS 恒为 `ios 版本号` |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| oaid | string | 否 | - |  oaid  |\n| osAndroidAPILevel | number | 否 | - |  Android 系统API库的版本。  |\n\n###### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n###### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n\n###### GetSystemInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 4.4 | √ | √ | x | x | x |\n| osAndroidAPILevel | 4.4 | √ | √ | x | x | x |\n","returnValue":"","compatibility":"### getSystemInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getSystemInfo](http://uniapp.dcloud.io/api/system/info?id=getsysteminfo)\n"},"getSystemInfoSync":{"name":"## uni.getSystemInfoSync() @getsysteminfosync","description":"同步获取系统信息","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetSystemInfoResult](#getsysteminforesult-values) | \n\n#### GetSystemInfoResult 属性值 @getsysteminforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| SDKVersion | string | 是 | - |  客户端基础库版本 |\n| appId | string | 是 | - |  `manifest.json` 中应用appid。 |\n| appLanguage | string | 是 | - |  应用设置的语言。 |\n| appName | string | 是 | - |  `manifest.json` 中应用名称（真机运行时，为基座的应用名称）。 |\n| appVersion | string | 是 | - |  `manifest.json` 中应用版本名称（真机运行时，为基座的版本名称）。 |\n| appVersionCode | number | 是 | - |  `manifest.json` 中应用版本名号（真机运行时，为基座的版本号）。 |\n| brand | string | 是 | - |  手机品牌。 |\n| browserName | string | 是 | - |  浏览器名称。`App` 端是系统 webview 的名字，比如 wkwebview、chrome。小程序端为空 |\n| browserVersion | string | 是 | - |  浏览器版本、webview 版本。 |\n| deviceId | string | 是 | - |  设备 ID |\n| deviceBrand | string | 是 | - |  设备品牌。如：`apple`、`huawei`。 |\n| deviceModel | string | 是 | - |  设备型号 |\n| deviceType | string | 是 | - |  设备类型。`phone`、`pad`、`pc` |\n| devicePixelRatio | number | 是 | - |  设备像素比 |\n| deviceOrientation | string | 是 | - |  设备方向。如：`竖屏 portrait`、`横屏 landscape` - portrait: 竖屏 - landscape: 横屏 |\n| language | string | 是 | - |  程序设置的语言 |\n| model | string | 是 | - |  手机型号 |\n| osName | string | 是 | - |  ios、android、windows、mac、linux |\n| osVersion | string | 是 | - |  操作系统版本。如 ios 版本，andriod 版本 |\n| osLanguage | string | 是 | - |  操作系统语言 |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| platform | string | 是 | - |  客户端平台 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| system | string | 是 | - |  操作系统版本 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| ua | string | 是 | - |  用户标识。小程序端为空 |\n| uniCompileVersion | string | 是 | - |  uni 编译器版本 |\n| uniPlatform | string | 是 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 是 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 是 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 是 | - |  uni 运行时版本号 |\n| version | string | 是 | - |  引擎版本号  |\n| romName | string | 是 | - |  rom 名称。Android 部分机型获取不到值。iOS 恒为 `ios` |\n| romVersion | string | 是 | - |  rom 版本号。Android 部分机型获取不到值。iOS 恒为 `ios 版本号` |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| oaid | string | 否 | - |  oaid  |\n| osAndroidAPILevel | number | 否 | - |  Android 系统API库的版本。  |\n\n##### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n##### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n\n##### GetSystemInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 4.4 | √ | √ | x | x | x |\n| osAndroidAPILevel | 4.4 | √ | √ | x | x | x |\n","compatibility":"### getSystemInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getSystemInfoSync](http://uniapp.dcloud.io/api/system/info?id=getsysteminfosync)\n"},"get-system-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-system-info/get-system-info.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view\r\n            class=\"uni-list-cell\"\r\n            v-for=\"(item, _) in items\"\r\n            style=\"align-items: center\"\r\n          >\r\n            <view class=\"uni-pd\">\r\n              <view class=\"uni-label\" style=\"width: 180px\">{{\r\n                item.label\r\n              }}</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <textarea\r\n                :auto-height=\"true\"\r\n                :disabled=\"true\"\r\n                placeholder=\"未获取\"\r\n                :value=\"item.value\"\r\n              />\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"getSystemInfoSync\">\r\n              同步获取设备系统信息\r\n            </button>\n            <button type=\"primary\" @tap=\"getSystemInfo\" style=\"margin-top: 20px;\">\n              异步获取设备系统信息\n            </button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\ntype Item = {\r\n\tlabel : string,\r\n\tvalue : string,\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'getSystemInfo',\r\n\t\t\titems: [] as Item[],\r\n\t\t}\r\n\t},\r\n\tonUnload: function () {\r\n\t},\r\n\tmethods: {\r\n\t\tgetSystemInfo: function () {\n\t\t\tuni.getSystemInfo({\r\n\t\t\t\tsuccess: (res) => {\n          this.items = [] as Item[];\n          for(const key in res){\n            const value = res[key];\n            if(value != null){\n              const item = {\n              \tlabel: key,\n              \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n              } as Item;\n              this.items.push(item);\n            }\n          }\n\t\t\t\t},\r\n\t\t\t})\r\n\t\t},\n    getSystemInfoSync: function () {\n      this.items = [] as Item[];\n      const res = uni.getSystemInfoSync()\n    \tfor(const key in res){\n    \t  const value = res[key];\n    \t  if(value != null){\n    \t    const item = {\n    \t    \tlabel: key,\n    \t    \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n    \t    } as Item;\n    \t    this.items.push(item);\n    \t  }\n    \t}\n    },\n    //自动化测试例专用\n    jest_getSystemInfo():GetSystemInfoResult{\n      return uni.getSystemInfoSync();\n    },\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-pd {\r\n  padding-left: 30rpx;\r\n}\r\n</style>\r\n\n```"},"getDeviceInfo":{"name":"## uni.getDeviceInfo(options?) @getdeviceinfo","description":"获取设备信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetDeviceInfoOptions](#getdeviceinfooptions-values) | 否 | 包含所有字段的过滤对象 | [options=包含所有字段的过滤对象\\] 过滤的字段对象, 不传参数默认为获取全部字段。 |\n#### GetDeviceInfoOptions 属性值 @getdeviceinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filter | Array\\<string\\> | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetDeviceInfoResult](#getdeviceinforesult-values) | \n\n#### GetDeviceInfoResult 属性值 @getdeviceinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| brand | string | 否 | - |  设备品牌 |\n| deviceBrand | string | 否 | - |  设备品牌 |\n| deviceId | string | 否 | - |  设备 id 。由 uni-app 框架生成并存储，清空 Storage 会导致改变 |\n| model | string | 否 | - |  设备型号\t |\n| deviceModel | string | 否 | - |  设备型号\t |\n| deviceType | string | 否 | - |  设备类型phone、pad、pc\t |\n| deviceOrientation | string | 否 | - |  设备方向 竖屏 portrait、横屏 landscape\t |\n| devicePixelRatio | string | 否 | - |  设备像素比\t |\n| system | string | 否 | - |  操作系统及版本\t |\n| platform | string | 否 | - |  客户端平台\t |\n| oaid | string | 否 | - |  oaid标识 Android专有  |\n| isRoot | boolean | 否 | - |  是否root |\n| isSimulator | boolean | 否 | - |  是否是模拟器 |\n| isUSBDebugging | boolean | 否 | - |  adb是否开启  |\n| idfa | string | 否 | - |  idfa标识 iOS专有  |\n\n##### GetDeviceInfoResult 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| oaid | 5.0 | √ | √ | 9.0 | x | x |\n| isUSBDebugging | 5.0 | √ | √ | 9.0 | x | x |\n| idfa | 5.0 | x | x | 9.0 | √ | √ |\n","compatibility":"### getDeviceInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[getDeviceInfo](https://uniapp.dcloud.net.cn/api/system/getDeviceInfo.html)\n"},"get-device-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-device-info/get-device-info.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view class=\"uni-list\">\r\n            <view\r\n              class=\"uni-list-cell\"\r\n              v-for=\"(item, _) in items\"\r\n              style=\"align-items: center\"\r\n            >\r\n              <view class=\"uni-pd\">\r\n                <view class=\"uni-label\" style=\"width: 180px\">{{\r\n                  item.label\r\n                }}</view>\r\n              </view>\r\n              <view class=\"uni-list-cell-db\">\r\n                <textarea\r\n                  :auto-height=\"true\"\r\n                  :disabled=\"true\"\r\n                  placeholder=\"未获取\"\r\n                  :value=\"item.value\"\r\n                />\r\n              </view>\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button type=\"primary\" @tap=\"getDeviceInfo\">获取设备信息</button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script>\r\ntype Item = {\r\n\tlabel : string,\r\n\tvalue : string,\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'getDeviceInfo',\r\n\t\t\titems: [] as Item[],\r\n\t\t}\r\n\t},\r\n\tonUnload:function(){\r\n\t},\r\n\tmethods: {\r\n\t\tgetDeviceInfo: function () {\r\n\t\t\tconst res = uni.getDeviceInfo();\n      this.items = [] as Item[];\r\n      for(const key in res){\n        const value = res[key];\n        if(value != null){\n          const item = {\n          \tlabel: key,\n          \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n          } as Item;\n          this.items.push(item);\n        }\n      }\r\n\t\t}\r\n\t}\r\n}\r\n</script>\r\n\r\n<style>\r\n.uni-pd {\r\n  padding-left: 30rpx;\r\n}\r\n</style>\r\n\n```"},"getWindowInfo":{"name":"## uni.getWindowInfo() @getwindowinfo","description":"同步获取窗口信息","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetWindowInfoResult](#getwindowinforesult-values) | \n\n#### GetWindowInfoResult 属性值 @getwindowinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| pixelRatio | number | 是 | - |  设备像素比 |\n| screenWidth | number | 是 | - |  屏幕宽度 |\n| screenHeight | number | 是 | - |  屏幕高度 |\n| windowWidth | number | 是 | - |  可使用窗口宽度 |\n| windowHeight | number | 是 | - |  可使用窗口高度 |\n| statusBarHeight | number | 是 | - |  状态栏的高度 |\n| windowTop | number | 是 | - |  可使用窗口的顶部位置 |\n| windowBottom | number | 是 | - |  可使用窗口的底部位置 |\n| safeArea | [SafeArea](#safearea-values) | 是 | - |  在竖屏正方向下的安全区域 |\n| safeAreaInsets | [SafeAreaInsets](#safeareainsets-values) | 是 | - |  在竖屏正方向下的安全区域插入位置 |\n| screenTop | number | 是 | - |  窗口上边缘的 y 值 |\n\n##### SafeArea 属性值 @safearea-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左上角横坐标 |\n| right | number | 是 | - |  安全区域右下角横坐标 |\n| top | number | 是 | - |  安全区域左上角纵坐标 |\n| bottom | number | 是 | - |  安全区域右下角纵坐标 |\n| width | number | 是 | - |  安全区域的宽度，单位逻辑像素 |\n| height | number | 是 | - |  安全区域的高度，单位逻辑像素 |\n\n##### SafeAreaInsets 属性值 @safeareainsets-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| left | number | 是 | - |  安全区域左侧插入位置 |\n| right | number | 是 | - |  安全区域右侧插入位置 |\n| top | number | 是 | - |  安全区顶部插入位置 |\n| bottom | number | 是 | - |  安全区域底部插入位置 |\n","compatibility":"### getWindowInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getWindowInfo](http://uniapp.dcloud.io/api/system/getWindowInfo.html)\n"},"get-window-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-window-info/get-window-info.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\" v-for=\"(item,_) in items\" style=\"align-items: center;\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">{{item.label}}</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<textarea :auto-height=\"true\" :disabled=\"true\" placeholder=\"未获取\" :value=\"item.value\" />\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getWindowInfo\">获取窗口信息</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\ttype Item = {\r\n\t\tlabel : string,\r\n\t\tvalue : string,\r\n\t}\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getWindowInfo',\r\n\t\t\t\titems: [] as Item[],\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload: function () {\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetWindowInfo: function () {\r\n\t\t\t\tconst res = uni.getWindowInfo();\n        this.items = [] as Item[];\n\t\t\t\tfor(const key in res){\n\t\t\t\t  const value = res[key];\n          if(value != null){\n            const item = {\n            \tlabel: key,\n            \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n            } as Item;\n            this.items.push(item);\n          }\n\t\t\t\t}\n\t\t\t},\n      //自动化测试例专用\n      jest_getWindowInfo():GetWindowInfoResult{\n        return uni.getWindowInfo();\n      },\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\n```"},"getAppBaseInfo":{"name":"## uni.getAppBaseInfo(options?) @getappbaseinfo","description":"获取app基本信息","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetAppBaseInfoOptions](#getappbaseinfooptions-values) | 否 | 包含所有字段的过滤对象 | [options=包含所有字段的过滤对象\\]  过滤的字段对象, 不传参数默认为获取全部字段。 |\n#### GetAppBaseInfoOptions 属性值 @getappbaseinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filter | Array\\<string\\> | 是 | - | - |\n","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetAppBaseInfoResult](#getappbaseinforesult-values) | \n\n#### GetAppBaseInfoResult 属性值 @getappbaseinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| appId | string | 否 | - |  manifest.json 中应用appid，即DCloud appid。\t |\n| appName | string | 否 | - |  `manifest.json` 中应用名称（真机运行时，为基座的应用名称）。 |\n| appVersion | string | 否 | - |  `manifest.json` 中应用版本名称（真机运行时，为基座的版本名称）。 |\n| appVersionCode | string | 否 | - |  `manifest.json` 中应用版本名号（真机运行时，为基座的版本号）。 |\n| appLanguage | string | 否 | - |  应用设置的语言en、zh-Hans、zh-Hant、fr、es\t |\n| language | string | 否 | - |  应用设置的语言\t |\n| version | string | 否 | - |  引擎版本号 |\n| isUniAppX | boolean | 否 | - |  是否uni-app x |\n| uniCompileVersion | string | 否 | - |  uni 编译器版本 |\n| uniPlatform | string | 否 | - |  uni-app 运行平台。如：`app`、`mp-weixin`、`web` |\n| uniRuntimeVersion | string | 否 | - |  uni 运行时版本 |\n| uniCompileVersionCode | number | 否 | - |  uni 编译器版本号 |\n| uniRuntimeVersionCode | number | 否 | - |  uni 运行时版本号 |\n","compatibility":"### getAppBaseInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[getAppBaseInfo](https://uniapp.dcloud.net.cn/api/system/getAppBaseInfo.html)\n"},"get-app-base-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app-base-info/get-app-base-info.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\n\t\t\t\t<view class=\"uni-list-cell\" v-for=\"(item,_) in items\" style=\"align-items: center;\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">{{item.label}}</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<textarea :auto-height=\"true\" :disabled=\"true\" placeholder=\"未获取\" :value=\"item.value\" />\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getAppBaseInfo\">获取App基础信息</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\ttype Item = {\n\t\tlabel : string,\n\t\tvalue : string,\n\t}\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getAppBaseInfo',\n\t\t\t\titems: [] as Item[],\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetAppBaseInfo: function () {\n\t\t\t\tconst res = uni.getAppBaseInfo();\n        this.items = [] as Item[];\n        for(const key in res){\n          const value = res[key];\n          if(value != null){\n            const item = {\n            \tlabel: key,\n            \tvalue: \"\" + ((typeof value == \"object\")? JSON.stringify(value) : value)\n            } as Item;\n            this.items.push(item);\n          }\n        }\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getAppAuthorizeSetting":{"name":"## uni.getAppAuthorizeSetting() @getappauthorizesetting","description":"获取 APP 授权设置。","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetAppAuthorizeSettingResult](#getappauthorizesettingresult-values) | \n\n#### GetAppAuthorizeSettingResult 属性值 @getappauthorizesettingresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| cameraAuthorized | string | 是 | - |  允许 App 使用摄像头的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.CAMERA` 权限；iOS平台没有该值 |\n| locationAuthorized | string | 是 | - |  允许 App 使用定位的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.ACCESS_COARSE_LOCATION` 权限；iOS平台：表示没有在 `manifest.json -> App模块配置` 中配置 `Geolocation(定位)` 模块 |\n| locationAccuracy | string | 否 | - |  定位准确度。true 表示模糊定位，false 表示精确定位 - reduced: 模糊定位 - full: 精准定位 - unsupported: 不支持（包括用户拒绝定位权限和没有在 `manifest.json -> App模块配置` 中配置 `Geolocation(定位)` 模块） |\n| microphoneAuthorized | string | 是 | - |  允许 App 使用麦克风的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台：表示没有授予 `android.permission.RECORD_AUDIO` 权限；iOS平台没有该值 |\n| notificationAuthorized | string | 是 | - |  允许 App 通知的开关 - authorized: 已经获得授权，无需再次请求授权 - denied: 请求授权被拒绝，无法再次请求授权；（此情况需要引导用户打开系统设置，在设置页中打开权限） - not determined: 尚未请求授权，会在App下一次调用系统相应权限时请求；（仅 iOS 会出现。此种情况下引导用户打开系统设置，不展示开关） - config error: Android平台没有该值；iOS平台：表示没有在 `manifest.json -> App模块配置` 中配置 `Push(推送)` 模块 |\n","compatibility":"### getAppAuthorizeSetting 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | x |\n","tutorial":"\n### 参见\n[getAppAuthorizeSetting](http://uniapp.dcloud.io/api/system/getappauthorizesetting)\n"},"get-app-authorize-setting":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-app-authorize-setting/get-app-authorize-setting.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用摄像头</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"cameraAuthorized\"/>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用定位</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">定位准确度</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationAccuracy\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权使用麦克风</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"microphoneAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">是否授权通知</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"notificationAuthorized\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getAppAuthorizeSetting\">获取App授权设置</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getAppAuthorizeSetting',\n\t\t\t\tcameraAuthorized:\"\",\n\t\t\t\tlocationAuthorized:\"\",\n\t\t\t\tlocationAccuracy:\"\",\n\t\t\t\tmicrophoneAuthorized:\"\",\n\t\t\t\tnotificationAuthorized:\"\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetAppAuthorizeSetting: function () {\n\t\t\t\tconst res = uni.getAppAuthorizeSetting();\n\t\t\t\tthis.cameraAuthorized = res.cameraAuthorized;\n\t\t\t\tthis.locationAuthorized = res.locationAuthorized;\n\t\t\t\tthis.locationAccuracy = res.locationAccuracy ?? \"unsupported\";\n\t\t\t\tthis.microphoneAuthorized = res.microphoneAuthorized;\n\t\t\t\tthis.notificationAuthorized = res.notificationAuthorized;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getSystemSetting":{"name":"## uni.getSystemSetting() @getsystemsetting","description":"获取系统设置","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetSystemSettingResult](#getsystemsettingresult-values) | \n\n#### GetSystemSettingResult 属性值 @getsystemsettingresult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| bluetoothEnabled | boolean | 否 | - |  蓝牙是否开启 |\n| bluetoothError | string | 否 | - |  蓝牙的报错信息 |\n| locationEnabled | boolean | 是 | - |  位置是否开启 |\n| wifiEnabled | boolean | 否 | - |  wifi是否开启 |\n| wifiError | string | 否 | - |  wifi的报错信息 |\n| deviceOrientation | string | 是 | - |  设备方向 |\n","compatibility":"### getSystemSetting 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | 9.0 | √ | 3.9.0 |\n","tutorial":"\n### 参见\n[getSystemSetting](https://uniapp.dcloud.net.cn/api/system/getsystemsetting.html)\n"},"get-system-setting":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-system-setting/get-system-setting.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-common-mt\">\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell\">\r\n\t\t\t\t\t<view class=\"uni-pd\">\r\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">蓝牙的系统开关</view>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\r\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"bluetoothEnabled\"/>\r\n\t\t\t\t\t</view>\r\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">地理位置的系统开关</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"locationEnabled\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">Wi-Fi 的系统开关</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"wifiEnabled\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\n\t\t\t\t<view class=\"uni-list-cell\">\n\t\t\t\t\t<view class=\"uni-pd\">\n\t\t\t\t\t\t<view class=\"uni-label\" style=\"width:180px;\">设备方向</view>\n\t\t\t\t\t</view>\n\t\t\t\t\t<view class=\"uni-list-cell-db\">\n\t\t\t\t\t\t<input class=\"uni-input\" type=\"text\" :disabled=\"true\" placeholder=\"未获取\" :value=\"deviceOrientation\"/>\n\t\t\t\t\t</view>\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-padding-wrap\">\r\n\t\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t\t<button type=\"primary\" @tap=\"getSystemSetting\">获取系统设置</button>\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'getSystemSetting',\n\t\t\t\tbluetoothEnabled:\"\",\n\t\t\t\tlocationEnabled:\"\",\n\t\t\t\twifiEnabled:\"\",\n\t\t\t\tdeviceOrientation:\"\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tonUnload:function(){\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\tgetSystemSetting: function () {\n\t\t\t\tconst res = uni.getSystemSetting();\n\t\t\t\tthis.bluetoothEnabled = (res.bluetoothEnabled ?? false) ? \"开启\" : \"关闭\";\n\t\t\t\tthis.locationEnabled = res.locationEnabled ? \"开启\" : \"关闭\";\n\t\t\t\tthis.wifiEnabled = (res.wifiEnabled ?? false) ? \"开启\" : \"关闭\";\n\t\t\t\tthis.deviceOrientation = res.deviceOrientation\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-pd {\r\n\t\tpadding-left: 30rpx;\r\n\t}\r\n</style>\r\n\n```"},"getBatteryInfoSync":{"name":"## uni.getBatteryInfoSync() @getbatteryinfosync","description":"获取电池电量信息\n> 本 API 是 [uni ext api](https://uniapp.dcloud.net.cn/api/extapi.html)，需下载插件：[uni-getbatteryinfo](https://ext.dcloud.net.cn/plugin?name=uni-getbatteryinfo)\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetBatteryInfoResult](#getbatteryinforesult-values) | \n\n#### GetBatteryInfoResult 属性值 @getbatteryinforesult-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| level | number | 是 | - |  设备电量，范围1 - 100 |\n| isCharging | boolean | 是 | - |  是否正在充电中 |\n","compatibility":"### getBatteryInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 3.6.11 | 3.9.0 | 9.0 | 3.6.11 | 3.9.0 |\n","tutorial":""},"get-battery-info":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-battery-info/get-battery-info.uvue) \n ```html\n<template>\n\t<view>\n\t\t<text>当前电量：{{level}}%</text>\n\t\t<text>是否充电中：{{isCharging}}</text>\n\t</view>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tlevel: 0,\n\t\t\t\tisCharging: false\n\t\t\t}\n\t\t},\n\t\tonLoad() {\n\t\t\tuni.getBatteryInfo({\n\t\t\t\tsuccess: res => {\n\t\t\t\t\tthis.level = res.level;\n\t\t\t\t\tthis.isCharging = res.isCharging;\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t}\n</script>\n<style>\n\n</style>\n```"},"chooseImage":{"name":"## uni.chooseImage(options) @chooseimage","description":"从本地相册选择图片或使用相机拍照","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ChooseImageOptions](#chooseimageoptions-values) | 是 | - | - |\n#### ChooseImageOptions 属性值 @chooseimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| count | number | 否 | 9 |  最多可以选择的图片张数，app端不限制，微信小程序最多可支持20个。 |\n| sizeType | Array\\<string\\> | 否 | ['original','compressed'\\] |  original 原图，compressed 压缩图，默认二者都有 |\n| sourceType | Array\\<string\\> | 否 | ['album','camera'\\] |  album 从相册选图，camera 使用相机，默认二者都有 |\n| extension | Array\\<string\\> | 否 | - |  根据文件拓展名过滤，每一项都不能是空字符串。默认不过滤。仅H5支持 |\n| crop | [ChooseImageCropOptions](#chooseimagecropoptions-values) | 否 | - |  图像裁剪参数，设置后 sizeType 失效。 |\n| success | (callback: [ChooseImageSuccessCallback](#chooseimagesuccesscallback-values)) => void | 否 | - |  成功则返回图片的本地文件路径列表 tempFilePaths |\n| fail | (callback: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (callback: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ChooseImageCropOptions 属性值 @chooseimagecropoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | number | 是 | - |  裁剪的宽度，单位为px，用于计算裁剪宽高比。 |\n| height | number | 是 | - |  裁剪的高度，单位为px，用于计算裁剪宽高比。 |\n| quality | number | 否 | 80 |  取值范围为1-100，数值越小，质量越低（仅对jpg格式有效）。默认值为80。 |\n| resize | boolean | 否 | - |  是否将width和height作为裁剪保存图片真实的像素值。默认值为true。注：设置为false时在裁剪编辑界面显示图片的像素值，设置为true时不显示。 |\n\n##### ChooseImageSuccessCallback 属性值 @chooseimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errSubject | string | 是 | - |  调用API的名称 |\n| errMsg | string | 是 | - | - |\n| tempFilePaths | Array\\<string\\> | 是 | - | - |\n| tempFiles | any | 是 | - | - |\n","returnValue":"","compatibility":"### chooseImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | - | - | - |\n","tutorial":"\n### 参见\n[chooseImage](http://uniapp.dcloud.io/api/media/image?id=chooseimage)\n"},"choose-image":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/choose-image/choose-image.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex:1\">\n  <!-- #endif -->\n    <view>\n      <page-head :title=\"title\"></page-head>\n      <view class=\"uni-common-mt\">\n        <view class=\"uni-list\">\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图片来源\n            </view>\n            <view class=\"uni-list-cell-right\" @click=\"chooseImageSource\">\n              <text class=\"click-t\">{{sourceType[sourceTypeIndex]}}</text>\n            </view>\n          </view>\n\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图片质量\n            </view>\n            <view class=\"uni-list-cell-right\" @click=\"chooseImageType\">\n              <text class=\"click-t\">{{sizeType[sizeTypeIndex]}}</text>\n            </view>\n          </view>\n\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              数量限制\n            </view>\n            <view class=\"uni-list-cell-right\">\n              <input class=\"click-t\" :value=\"countIndex+1\" type=\"number\" :maxlength=\"1\" @confirm=\"chooseImageCount\" confirm-type=\"done\" />\n            </view>\n          </view>\n          <view class=\"uni-list-cell cell-pd\">\n            <view class=\"uni-list-cell-left uni-label\">\n              图像裁剪\n            </view>\n            <view class=\"uni-list-cell-right\">\n              <switch :checked=\"isCrop\" @change=\"switchCrop\"></switch>\n            </view>\n          </view>\n          <view ref=\"cropOptionNode\" class=\"crop-option\" :style=\"{'height':isCrop?'200px':'0px'}\">\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                图片质量(%)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropPercent\" @confirm=\"cropPercentConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                裁剪宽度(px)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropWidth\" @confirm=\"cropWidthConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                裁剪高度(px)\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <input :value=\"cropHeight\" @confirm=\"cropHeightConfim\" type=\"number\" />\n              </view>\n            </view>\n            <view class=\"uni-list-cell cell-pd\">\n              <view class=\"uni-list-cell-left item_width\">\n                保留原宽高\n              </view>\n              <view class=\"uni-list-cell-right\">\n                <switch :checked=\"cropResize\" @change=\"cropResizeChange\"></switch>\n              </view>\n            </view>\n          </view>\n        </view>\n\n        <view class=\"uni-list list-pd\" style=\"padding: 30rpx;\">\n          <view class=\"uni-flex\" style=\"margin-bottom: 20rpx;\">\n            <view class=\"uni-list-cell-left\">点击可预览选好的图片</view>\n            <view style=\"margin-left: auto;\">\n              <text class=\"click-t\">{{imageList.length}}/{{countIndex+1}}</text>\n            </view>\n          </view>\n          <view class=\"uni-flex\" style=\"flex-wrap: wrap;\">\n            <view v-for=\"(image,index) in imageList\" :key=\"index\" class=\"uni-uploader__input-box\" style=\"border: 0rpx;\">\n              <image style=\"width: 208rpx; height: 208rpx;\" :src=\"image\" :data-src=\"image\" @tap=\"previewImage(index)\"></image>\n              <image src=\"/static/plus.png\" class=\"image-remove\" @click=\"removeImage(index)\"></image>\n            </view>\n            <image class=\"uni-uploader__input-box\" @tap=\"chooseImage\" src=\"/static/plus.png\"></image>\n          </view>\n        </view>\n      </view>\n    </view>\n  <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\n  var sourceTypeArray = [\n    ['camera'],\n    ['album'],\n    ['camera', 'album']\n  ]\n  var sizeTypeArray = [\n    ['compressed'],\n    ['original'],\n    ['compressed', 'original']\n  ]\n  export default {\n    data() {\n      return {\n        title: 'choose/previewImage',\n        imageList: [] as Array<string>,\n        sourceTypeIndex: 2,\n        sourceType: ['拍照', '相册', '拍照或相册'],\n        sizeTypeIndex: 2,\n        sizeType: ['压缩', '原图', '压缩或原图'],\n        countIndex: 8,\n        count: [1, 2, 3, 4, 5, 6, 7, 8, 9],\n        isCrop: false,\n        cropPercent: 80,\n        cropWidth: 100,\n        cropHeight: 100,\n        cropResize: false\n      }\n    },\n    onUnload() {\n      this.imageList = [];\n      this.sourceTypeIndex = 2\n      this.sourceType = ['拍照', '相册', '拍照或相册']\n      this.sizeTypeIndex = 2\n      this.sizeType = ['压缩', '原图', '压缩或原图']\n      this.countIndex = 8\n    },\n    methods: {\n      cropHeightConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0) {\n          this.cropHeight = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"裁剪高度需要大于0\"\n          })\n        }\n      },\n      cropWidthConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0) {\n          this.cropWidth = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"裁剪宽度需要大于0\"\n          })\n        }\n      },\n      cropPercentConfim(e : InputConfirmEvent) {\n        let value = parseInt(e.detail.value)\n        if (value > 0 && value <= 100) {\n          this.cropPercent = value\n        } else {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"请输入0~100之间的值\"\n          })\n        }\n      },\n      cropResizeChange(e : SwitchChangeEvent) {\n        this.cropResize = e.detail.value\n      },\n      switchCrop(e : SwitchChangeEvent) {\n        this.isCrop = e.detail.value\n      },\n      removeImage(index : number) {\n        this.imageList.splice(index, 1)\n      },\n      chooseImageSource() {\n        uni.showActionSheet({\n          itemList: ['拍照', '相册', '拍照或相册'],\n          success(e) {\n            this.sourceTypeIndex = e.tapIndex!\n          }\n        })\n      },\n      chooseImageType() {\n        uni.showActionSheet({\n          itemList: ['压缩', '原图', '压缩或原图'],\n          success(e) {\n            this.sizeTypeIndex = e.tapIndex!\n          }\n        })\n      },\n      chooseImageCount(event : InputConfirmEvent) {\n        let count = parseInt(event.detail.value) - 1\n        if (count < 0) {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"图片数量应该大于0\"\n          })\n          return\n        }\n        this.countIndex = count\n      },\n      chooseImage: function () {\n        // var cropOption:ChooseImageCropOptions|null = this.isCrop ? null : new ChooseImageCropOptions(  )\n        if (this.imageList.length >= 9) {\n          uni.showToast({\n            position: \"bottom\",\n            title: \"已经有9张图片了，请删除部分图片之后重新选择\"\n          })\n          return\n        }\n        uni.chooseImage({\n          sourceType: sourceTypeArray[this.sourceTypeIndex],\n          sizeType: sizeTypeArray[this.sizeTypeIndex],\n          crop: this.isCrop ? { \"quality\": this.cropPercent, \"width\": this.cropWidth, \"height\": this.cropHeight, \"resize\": this.cropResize } as ChooseImageCropOptions : null,\n          count: this.imageList.length + this.count[this.countIndex] > 9 ? 9 - this.imageList.length : this.count[this.countIndex],\n          success: (res) => {\n            this.imageList = this.imageList.concat(res.tempFilePaths);\n          },\n          fail: (err) => {\n            console.log(\"err: \", JSON.stringify(err));\n          }\n        })\n      },\n      previewImage: function (index : number) {\n        uni.previewImage({\n          current: index,\n          urls: this.imageList\n        })\n      }\n    }\n  }\n</script>\n\n<style>\n  .cell-pd {\n    padding: 22rpx 30rpx;\n  }\n\n  .click-t {\n    color: darkgray;\n  }\n\n  .list-pd {\n    margin-top: 50rpx;\n  }\n\n  .uni-uploader__input-box {\n    margin: 10rpx;\n    width: 208rpx;\n    height: 208rpx;\n    border: 2rpx solid #D9D9D9;\n  }\n\n  .uni-uploader__input {\n    position: absolute;\n    z-index: 1;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n  }\n\n  .image-remove {\n    transform: rotate(45deg);\n    width: 50rpx;\n    height: 50rpx;\n    position: absolute;\n    top: 0;\n    right: 0;\n    border-radius: 25rpx;\n    background-color: rgba(200, 200, 200, 0.8);\n  }\n\n  .item_width {\n    width: 260rpx;\n  }\n\n  .crop-option {\n    border-top-color: lightgray;\n    border-width: 1rpx;\n    padding: 20rpx;\n    transition: height;\n    transition-duration: 300;\n  }\n</style>\n```"},"previewImage":{"name":"## uni.previewImage(options) @previewimage","description":"预览图片","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [PreviewImageOptions](#previewimageoptions-values) | 是 | - | - |\n#### PreviewImageOptions 属性值 @previewimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| count | string | 否 | - |  当前显示图片的链接，不填则默认为 urls 的第一张 |\n| current | any | 否 | - |  current 为当前显示图片的链接/索引值，不填或填写的值无效则为 urls 的第一张。App平台在 1.9.5至1.9.8之间，current为必填。不填会报错 |\n| urls | Array\\<string\\> | 是 | - | - |\n| indicator | string | 否 | - |  图片指示器样式 - default: 底部圆点指示器 - number: 顶部数字指示器 - none: 不显示指示器 |\n| loop | boolean | 否 | - |  是否可循环预览 |\n| longPressActions | [LongPressActionsOptions](#longpressactionsoptions-values) | 否 | - |  长按图片显示操作菜单，如不填默认为保存相册，1.9.5 起支持。 |\n| success | (result: [PreviewImageSuccessCallback](#previewimagesuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### LongPressActionsOptions 属性值 @longpressactionsoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| itemList | Array\\<string\\> | 是 | - | - |\n| itemColor | string | 否 | - |  按钮的文字颜色，字符串格式，默认为\"#000000\" |\n| success | (result: [LongPressActionsSuccessData](#longpressactionssuccessdata-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: any) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n###### LongPressActionsSuccessData 属性值 @longpressactionssuccessdata-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| tapIndex | number | 是 | - |  接口调用失败的回调函数 |\n| index | number | 是 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### PreviewImageSuccessCallback 属性值 @previewimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errSubject | string | 是 | - | - |\n| errMsg | string | 是 | - | - |\n","returnValue":"","compatibility":"### previewImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | - | - | - |\n","tutorial":"\n### 参见\n[previewImage](http://uniapp.dcloud.io/api/media/image?id=previewimage)\n"},"closePreviewImage":{"name":"## uni.closePreviewImage(options) @closepreviewimage","description":"关闭图片预览","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [ClosePreviewImageOptions](#closepreviewimageoptions-values) | 是 | - | - |\n#### ClosePreviewImageOptions 属性值 @closepreviewimageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (result: [ClosePreviewImageSuccessCallback](#closepreviewimagesuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### ClosePreviewImageSuccessCallback 属性值 @closepreviewimagesuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n","returnValue":"","compatibility":"### closePreviewImage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | - | - | - |\n","tutorial":"\n### 参见\n[closePreviewImage](http://uniapp.dcloud.io/api/media/image?id=closepreviewimage)\n"},"preview-image":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/preview-image/preview-image.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n    <!-- #endif -->\n    <view style=\"padding-left: 16rpx; padding-right: 16rpx\">\n      <view>\n        <text class=\"text-desc\">图片指示器样式</text>\n        <radio-group\n          class=\"cell-ct\"\n          style=\"background-color: white\"\n          @change=\"onIndicatorChanged\"\n        >\n          <view\n            class=\"indicator-it\"\n            v-for=\"(item, index) in indicator\"\n            :key=\"item.value\"\n          >\n            <radio :checked=\"index == 0\" :value=\"item.value\">{{\n              item.name\n            }}</radio>\n          </view>\n        </radio-group>\n      </view>\n      <view>\n        <checkbox-group\n          @change=\"onCheckboxChange\"\n          style=\"margin-top: 32rpx; margin-bottom: 32rpx; margin-left: 16rpx\"\n        >\n          <checkbox :checked=\"isLoop\" style=\"margin-right: 30rpx\"\n            >循环播放</checkbox\n          >\n        </checkbox-group>\n      </view>\n      <view style=\"background-color: white\">\n        <text class=\"text-desc\">点击图片开始预览</text>\n        <view class=\"cell-ct\" style=\"background-color: #eeeeee; padding: 16rpx\">\n          <view\n            class=\"cell cell-choose-image\"\n            v-for=\"(image, index) in imageList\"\n            :key=\"index\"\n          >\n            <image\n              style=\"width: 210rpx; height: 210rpx\"\n              mode=\"aspectFit\"\n              :src=\"image\"\n              @click=\"previewImage(index)\"\n            ></image>\n          </view>\n          <image\n            class=\"cell cell-choose-image\"\n            src=\"/static/plus.png\"\n            @click=\"chooseImage\"\n          >\n            <view></view>\n          </image>\n        </view>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script>\ntype ItemType = {\n\tvalue: string,\n\tname: string\n}\n\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\timageList: [\"https://web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png\", \"/static/uni.png\"],\n\t\t\tindicator: [{\n\t\t\t\tvalue: \"default\",\n\t\t\t\tname: \"圆点\"\n\t\t\t}, {\n\t\t\t\tvalue: \"number\",\n\t\t\t\tname: \"数字\"\n\t\t\t}, {\n\t\t\t\tvalue: \"none\",\n\t\t\t\tname: \"不显示\"\n\t\t\t}] as ItemType[],\n\t\t\tcurrentIndicator: \"default\",\n\t\t\tisLoop: true\n\t\t}\n\t},\n\tmethods: {\n\t\tpreviewImage(index: number) {\n\t\t\tuni.previewImage({\n\t\t\t\turls: this.imageList,\n\t\t\t\tcurrent: index,\n\t\t\t\tindicator: this.currentIndicator,\n\t\t\t\tloop: this.isLoop\n\t\t\t})\n\t\t},\n\t\tchooseImage() {\n\t\t\tuni.chooseImage({\n\t\t\t\tsourceType: ['album'],\n\t\t\t\tsuccess: (e) => {\n\t\t\t\t\tthis.imageList = this.imageList.concat(e.tempFilePaths)\n\t\t\t\t},\n\t\t\t\tfail(_) {\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\t\tonIndicatorChanged(e: RadioGroupChangeEvent) {\n\t\t\tthis.currentIndicator = e.detail.value\n\t\t},\n\t\tonCheckboxChange(_: CheckboxGroupChangeEvent) {\n\t\t\tthis.isLoop = !this.isLoop\n\t\t}\n\t}\n}\n</script>\n\n<style>\n.text-desc {\n  margin-top: 32rpx;\n  margin-left: 16rpx;\n  margin-bottom: 32rpx;\n  font-weight: bold;\n}\n\n.cell-ct {\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: row;\n}\n\n.cell {\n  margin-left: 14rpx;\n  width: 210rpx;\n  height: 210rpx;\n}\n\n.cell-choose-image {\n  border-width: 1px;\n  border-color: lightgray;\n}\n\n.indicator-it {\n  margin: 16rpx;\n}\n</style>\n\n```"},"saveImageToPhotosAlbum":{"name":"## uni.saveImageToPhotosAlbum(options) @saveimagetophotosalbum","description":"保存图片到系统相册","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SaveImageToPhotosAlbumOptions](#saveimagetophotosalbumoptions-values) | 是 | - | - |\n#### SaveImageToPhotosAlbumOptions 属性值 @saveimagetophotosalbumoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| filePath | string | 是 | - |  图片文件路径，可以是临时文件路径也可以是永久文件路径，不支持网络图片路径 |\n| success | (result: [SaveImageToPhotosAlbumSuccessCallback](#saveimagetophotosalbumsuccesscallback-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### SaveImageToPhotosAlbumSuccessCallback 属性值 @saveimagetophotosalbumsuccesscallback-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| path | string | 是 | - |  保存到相册的图片路径 |\n","returnValue":"","compatibility":"### saveImageToPhotosAlbum 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | 3.9.0 | - | - | - |\n","tutorial":"\n### 参见\n[saveImageToPhotosAlbum](http://uniapp.dcloud.io/api/media/image?id=saveimagetophotosalbum)\n"},"save-image-to-photos-album":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/save-image-to-photos-album/save-image-to-photos-album.uvue) \n ```html\n<template>\n\t<!-- #ifdef APP -->\n\t<scroll-view style=\"flex:1\">\n\t\t<!-- #endif -->\n\t\t<image src=\"/static/uni.png\" style=\"margin: 30rpx 200rpx;height:350rpx;width: 350rpx;\"></image>\n\t\t<button style=\"margin: 30rpx;\" @click=\"saveImage\">将图片保存到手机相册</button>\n\t\t<!-- #ifdef APP -->\n\t</scroll-view>\n\t<!-- #endif -->\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tsaveImage() {\n\t\t\t\tuni.saveImageToPhotosAlbum({\n\t\t\t\t\tfilePath: \"/static/uni.png\",\n\t\t\t\t\tsuccess() {\n\t\t\t\t\t\tuni.showToast({\n\t\t\t\t\t\t\tposition: \"center\",\n\t\t\t\t\t\t\ticon: \"none\",\n\t\t\t\t\t\t\ttitle: \"图片保存成功，请到手机相册查看\"\n\t\t\t\t\t\t})\n\t\t\t\t\t},\n\t\t\t\t\tfail(e) {\n\t\t\t\t\t\tuni.showModal({\n\t\t\t\t\t\t\tcontent: \"保存相册失败，errCode：\" + e.errCode + \"，errMsg：\" + e.errMsg + \"，errSubject：\" + e.errSubject,\n\t\t\t\t\t\t\tshowCancel: false\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\t}\n</script>\n\n<style>\n</style>\n```"},"getLocation":{"name":"## uni.getLocation(options) @getlocation","description":"\n获取当前的地理位置、速度\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetLocationOptions](#getlocationoptions-values) | 是 | - | - |\n#### GetLocationOptions 属性值 @getlocationoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 否 | - |  默认为 wgs84 返回 gps 坐标，gcj02 返回可用于uni.openLocation的坐标 |\n| altitude | boolean | 否 | - |  传入 true 会返回高度信息，由于获取高度需要较高精确度，会减慢接口返回速度 |\n| geocode | boolean | 否 | - |  传入 true 会解析地址 |\n| highAccuracyExpireTime | number | 否 | - |  高精度定位超时时间(ms)，指定时间内返回最高精度，该值3000ms以上高精度定位才有效果 |\n| isHighAccuracy | boolean | 否 | - |  开启高精度定位 |\n| success | (result: [GetLocationSuccess](#getlocationsuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (result: UniError) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (result: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetLocationSuccess 属性值 @getlocationsuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| latitude | number | 是 | - |  纬度，浮点数，范围为-90~90，负数表示南纬 |\n| longitude | number | 是 | - |  经度，范围为-180~180，负数表示西经 |\n| speed | number | 是 | - |  速度，浮点数，单位m/s |\n| accuracy | number | 是 | - |  位置的精确度 |\n| altitude | number | 是 | - |  高度，单位 m |\n| verticalAccuracy | number | 是 | - |  垂直精度，单位 m（Android 无法获取，返回 0） |\n| horizontalAccuracy | number | 是 | - |  水平精度，单位 m |\n| address | any | 否 | - |  地址信息 |\n","returnValue":"","compatibility":"","tutorial":"\n### 参见\n[getLocation](http://uniapp.dcloud.io/api/location/location?id=getlocation)\n"},"get-location":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/get-location/get-location.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view style=\"padding: 4px;\">\n    \t<text class=\"hello-text\">\n        真机运行标准基座仅包含系统定位，即system。\\n\n        部分手机因gms兼容不好可能导致无法定位。\\n\n        gcj国标、逆地理信息等功能需三方sdk定位。如果需要类似能力可以下载腾讯定位插件，打包自定义基座。参考示例：</text>\n    \t<u-link :href=\"'https://ext.dcloud.net.cn/plugin?id=14569'\" :text=\"'https://ext.dcloud.net.cn/plugin?id=14569'\" :inWhiteList=\"true\"></u-link>\n    </view>\n\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-list\">\n        <radio-group @change=\"radioChange\">\n          <radio class=\"uni-list-cell uni-list-cell-pd\" v-for=\"(item, index) in items\" :key=\"item.value\"\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line': ''\" :value=\"item.value\"\n            :checked=\"index === current\">\n            {{item.name}}\n          </radio>\n        </radio-group>\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">高度信息</view>\n        <switch :checked=\"altitudeSelect\" @change=\"altitudeChange\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">开启高精度定位</view>\n        <switch :checked=\"isHighAccuracySelect\" @change=\"highAccuracySelectChange\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">是否解析地址信息</view>\n        <switch :checked=\"geocodeSelect\" @change=\"geocodeChange\" />\n      </view>\n      <text>{{exeRet}}</text>\n      <view class=\"uni-btn-v\">\n        <button class=\"uni-btn\" type=\"default\" @tap=\"getLocationTap\">获取定位</button>\n      </view>\n    </view>\n  </view>\n</template>\n<script lang=\"uts\">\n  type ItemType = {\n    value : string,\n    name : string,\n  }\n  export default {\n    data() {\n      return {\n        title: 'get-location',\n        altitudeSelect: false,\n        isHighAccuracySelect: false,\n        geocodeSelect: false,\n        exeRet: '',\n        items: [\n        {\n          value: 'wgs84',\n          name: 'wgs84'\n        },\n        {\n          value: 'gcj02',\n          name: 'gcj02'\n        }\n        ] as ItemType[],\n        current: 0,\n      }\n    },\n    methods: {\n      altitudeChange: function (e : SwitchChangeEvent) {\n        this.altitudeSelect = e.detail.value\n      },\n      geocodeChange: function (e : SwitchChangeEvent) {\n        this.geocodeSelect = e.detail.value\n      },\n      highAccuracySelectChange: function (e : SwitchChangeEvent) {\n        this.isHighAccuracySelect = e.detail.value\n      },\n      radioChange(e : RadioGroupChangeEvent) {\n        for (let i = 0; i < this.items.length; i++) {\n          if (this.items[i].value === e.detail.value) {\n            this.current = i;\n            break;\n          }\n        }\n      },\n      getLocationTap: function () {\n        uni.showLoading({\n          title: '定位中'\n        })\n        uni.getLocation(({\n          type: this.items[this.current].value,\n          altitude: this.altitudeSelect,\n          isHighAccuracy: this.isHighAccuracySelect,\n          geocode: this.geocodeSelect,\n          success: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          },\n          fail: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          },\n          complete: function (res : any) {\n            uni.hideLoading()\n            console.log(res);\n            this.exeRet = JSON.stringify(res)\n          }\n        }));\n\n\n      }\n\n    }\n  }\n</script>\n<style>\n@import '@/common/uni-uvue.css';\n</style>\n\n```"},"setStorage":{"name":"## uni.setStorage(options) @setstorage","description":"\nuni.setStorage函数定义\n将数据存储在本地storage存储中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。  \n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [SetStorageOptions](#setstorageoptions-values) | 是 | - |  uni.setStorage参数定义 |\n#### SetStorageOptions 属性值 @setstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| data | any | 是 | - |  需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象 |\n| success | (res: [SetStorageSuccess](#setstoragesuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### setStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[setStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#setstorage)\n"},"setStorageSync":{"name":"## uni.setStorageSync(key, data) @setstoragesync","description":"\nuni.setStorageSync函数定义\n将 data 存储在本地storage存储中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个同步接口。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地storage存储中的指定的 key |\n| data | any | 是 | - | 需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象 |","returnValue":"","compatibility":"### setStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[setStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#setstoragesync)\n"},"getStorage":{"name":"## uni.getStorage(options) @getstorage","description":"\nuni.getStorage函数定义\n从本地存储中异步获取指定 key 对应的内容。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetStorageOptions](#getstorageoptions-values) | 是 | - |  uni.getStorage参数定义 |\n#### GetStorageOptions 属性值 @getstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| success | (res: [GetStorageSuccess](#getstoragesuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetStorageSuccess 属性值 @getstoragesuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | any | 否 | - |  key 对应的内容 |\n","returnValue":"","compatibility":"### getStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorage)\n"},"getStorageSync":{"name":"## uni.getStorageSync(key) @getstoragesync","description":"\nuni.getStorageSync函数定义\n从本地存储中同步获取指定 key 对应的内容。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地存储中的指定的 key |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| any | 否 | \n","compatibility":"### getStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstoragesync)\n"},"getStorageInfo":{"name":"## uni.getStorageInfo(options) @getstorageinfo","description":"\nuni.getStorageInfo函数定义\n异步获取当前 storage 的相关信息。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [GetStorageInfoOptions](#getstorageinfooptions-values) | 是 | - |  uni.getStorageInfo参数定义 |\n#### GetStorageInfoOptions 属性值 @getstorageinfooptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [GetStorageInfoSuccess](#getstorageinfosuccess-values)) => void | 否 | - |  接口调用成功的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n\n##### GetStorageInfoSuccess 属性值 @getstorageinfosuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| keys | Array\\<string\\> | 是 | - | - |\n| currentSize | number | 是 | - |  当前占用的空间大小, 单位：kb |\n| limitSize | number | 是 | - |  限制的空间大小, 单位：kb |\n","returnValue":"","compatibility":"### getStorageInfo 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageInfo](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorageinfo)\n"},"getStorageInfoSync":{"name":"## uni.getStorageInfoSync() @getstorageinfosync","description":"\nuni.getStorageInfoSync函数定义\n同步获取当前 storage 的相关信息。\n\n","param":"","returnValue":"### 返回值 \n\n| 类型 |\n| :- |\n| [GetStorageInfoSuccess](#getstorageinfosuccess-values) | \n\n#### GetStorageInfoSuccess 属性值 @getstorageinfosuccess-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| keys | Array\\<string\\> | 是 | - | - |\n| currentSize | number | 是 | - |  当前占用的空间大小, 单位：kb |\n| limitSize | number | 是 | - |  限制的空间大小, 单位：kb |\n","compatibility":"### getStorageInfoSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[getStorageInfoSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#getstorageinfosync)\n"},"removeStorage":{"name":"## uni.removeStorage(options) @removestorage","description":"\nuni.removeStorage函数定义\n从本地存储中异步移除指定 key。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| options | [RemoveStorageOptions](#removestorageoptions-values) | 是 | - |  uni.removeStorage参数定义 |\n#### RemoveStorageOptions 属性值 @removestorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - |  本地存储中的指定的 key |\n| success | (res: [RemoveStorageSuccess](#removestoragesuccess-values)) => void | 否 | - |  接口调用的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### removeStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[removeStorage](hhttps://uniapp.dcloud.net.cn/api/storage/storage.html#removestorage)\n"},"removeStorageSync":{"name":"## uni.removeStorageSync(key) @removestoragesync","description":"\nuni.removeStorageSync函数定义\n从本地存储中同步移除指定 key。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| key | string | 是 | - | 本地存储中的指定的 key |","returnValue":"","compatibility":"### removeStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[removeStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#removestoragesync)\n"},"clearStorage":{"name":"## uni.clearStorage(option?) @clearstorage","description":"\nuni.clearStorage函数定义\n清除本地数据存储。\n","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| option | [ClearStorageOptions](#clearstorageoptions-values) | 否 | - | - |\n#### ClearStorageOptions 属性值 @clearstorageoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| success | (res: [ClearStorageSuccess](#clearstoragesuccess-values)) => void | 否 | - |  接口调用的回调函数 |\n| fail | (res: [UniError](/tutorial/err-spec.html#unierror)) => void | 否 | - |  接口调用失败的回调函数 |\n| complete | (res: any) => void | 否 | - |  接口调用结束的回调函数（调用成功、失败都会执行） |\n","returnValue":"","compatibility":"### clearStorage 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[clearStorage](https://uniapp.dcloud.net.cn/api/storage/storage.html#clearstorage)\n"},"clearStorageSync":{"name":"## uni.clearStorageSync() @clearstoragesync","description":"\nuni.clearStorageSync函数定义\n清除本地数据存储。\n","param":"","returnValue":"","compatibility":"### clearStorageSync 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4.4 | 2.0.3 | 3.9.0 | 9.0 | 2.0.3 | 3.9.0 |\n","tutorial":"\n### 参见\n[clearStorageSync](https://uniapp.dcloud.net.cn/api/storage/storage.html#clearstoragesync)\n"},"storage":{"example":"## 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/API/storage/storage.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view>\r\n      <page-head :title=\"title\"></page-head>\r\n      <view class=\"uni-common-mt\">\r\n        <view class=\"uni-list\">\r\n          <view class=\"uni-list-cell uni-list-cell-line\">\r\n            <view class=\"uni-list-cell-left\">\r\n              <view class=\"uni-label\">key</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <input\r\n                class=\"uni-input\"\r\n                type=\"text\"\r\n                placeholder=\"请输入key\"\r\n                name=\"key\"\r\n                :value=\"key\"\r\n                @input=\"keyChange\"\r\n              />\r\n            </view>\r\n          </view>\r\n          <view class=\"uni-list-cell\">\r\n            <view class=\"uni-list-cell-left\">\r\n              <view class=\"uni-label\">value</view>\r\n            </view>\r\n            <view class=\"uni-list-cell-db\">\r\n              <input\r\n                class=\"uni-input\"\r\n                type=\"text\"\r\n                placeholder=\"请输入value\"\r\n                name=\"data\"\r\n                :value=\"data\"\r\n                @input=\"dataChange\"\r\n              />\r\n            </view>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button class=\"uni-btn btn-getStorageInfoASync\" type=\"primary\" @tap=\"getStorageInfo\">\r\n              获取存储概述-异步\r\n            </button>\r\n            <button class=\"uni-btn btn-getStorageInfoSync\" @tap=\"getStorageInfoSync\">\r\n              获取存储概述-同步\r\n            </button>\r\n          </view>\r\n          <text>{{ storageInfo }}</text>\r\n          <view class=\"uni-flex uni-row\">\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"strMock\"\r\n            >\r\n              填充字符串\r\n            </button>\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"complexMock\"\r\n            >\r\n              填充复杂对象\r\n            </button>\r\n          </view>\r\n          <view class=\"uni-flex uni-row\">\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"numberMock\"\r\n            >\r\n              填充整型\r\n            </button>\r\n            <button\r\n              type=\"default\"\n              style=\"width:325rpx\"\r\n              @tap=\"floatMock\"\r\n            >\r\n              填充浮点型\r\n            </button>\r\n          </view>\r\n        </view>\r\n        <view class=\"uni-padding-wrap\">\r\n          <view class=\"uni-btn-v\">\r\n            <button\r\n              type=\"primary\"\r\n              class=\"uni-btn btn-setstorageAsync\"\r\n              @tap=\"setStorage\"\r\n            >\r\n              存储数据-异步\r\n            </button>\r\n            <button class=\"uni-btn btn-getstorageAsync\" @tap=\"getStorage\">读取数据-异步</button>\r\n            <button class=\"uni-btn btn-removeStorageInfoASync\" @tap=\"removeStorage\">移除数据-异步</button>\r\n            <button class=\"uni-btn btn-clearStorageInfoASync\" @tap=\"clearStorage\">清理数据-异步</button>\r\n          </view>\r\n\r\n          <view class=\"uni-btn-v\">\r\n            <button\r\n              type=\"primary\"\r\n              class=\"uni-btn btn-setstorageSync\"\r\n              @tap=\"setStorageSync\"\r\n            >\r\n              存储数据-同步\r\n            </button>\r\n            <button class=\"uni-btn btn-getstorageSync\" @tap=\"getStorageSync\">读取数据-同步</button>\r\n            <button class=\"uni-btn btn-removeStorageInfoSync\" @tap=\"removeStorageSync\">\r\n              移除数据-同步\r\n            </button>\r\n            <button class=\"uni-btn btn-clearStorageInfoSync\" @tap=\"clearStorageSync\">\r\n              清理数据-同步\r\n            </button>\r\n          </view>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\nexport default {\r\n  data() {\r\n    return {\r\n      title: 'get/set/clearStorage',\r\n      key: '',\r\n      data: '' as any,\n      apiGetData:'' as any|null,\r\n      storageInfo: '',\r\n    }\r\n  },\r\n  methods: {\r\n    getStorageInfo() {\r\n      uni.getStorageInfo({\r\n        success: function (res) {\n          this.apiGetData = res\r\n          this.storageInfo = JSON.stringify(res)\r\n        },\r\n      })\r\n    },\r\n    getStorageInfoSync() {\r\n      try {\r\n        const res = uni.getStorageInfoSync()\n        this.apiGetData = res\r\n        this.storageInfo = JSON.stringify(res)\n      } catch (e) {\r\n        // error\r\n        console.log(e)\r\n      }\r\n    },\r\n    strMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = '测试字符串数据，长度为16个字符'\r\n    },\r\n    complexMock() {\r\n      this.key = 'key_' + Math.random()\r\n      let jsonObj = {\r\n        name: '张三',\r\n        age: 12,\r\n        classMate: [\r\n          {\r\n            id: 1001,\r\n            name: '李四',\r\n          },\r\n          {\r\n            id: 1002,\r\n            name: 'jack ma',\r\n          },\r\n        ],\r\n      }\r\n      this.data = jsonObj\r\n    },\r\n    numberMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = 10011\r\n    },\r\n    floatMock() {\r\n      this.key = 'key_' + Math.random()\r\n      this.data = 3.1415926535893384626\r\n    },\r\n\r\n    keyChange: function (e: InputEvent) {\r\n      this.key = e.detail.value\r\n    },\r\n    dataChange: function (e: InputEvent) {\r\n      this.data = e.detail.value\r\n    },\r\n    getStorage: function () {\r\n      var key = this.key\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '读取数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\n        let that = this\r\n        uni.getStorage({\r\n          key: key,\r\n          success: (res) => {\n            that.apiGetData = res.data\n\n            let desc:string = typeof this.apiGetData\n            if(\"object\" == desc){\n              desc = desc  + \": \" + JSON.stringify(this.apiGetData)\n            }else{\n              desc = desc  + \": \" + this.apiGetData\n            }\n\r\n            uni.showModal({\r\n              title: '读取数据成功',\r\n              content: desc,\r\n              showCancel: false,\r\n            })\r\n          },\r\n          fail: () => {\r\n            uni.showModal({\r\n              title: '读取数据失败',\r\n              content: '找不到 key 对应的数据',\r\n              showCancel: false,\r\n            })\r\n          },\r\n        })\r\n      }\r\n    },\r\n    getStorageSync: function () {\r\n      var key = this.key\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '读取数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        this.apiGetData = uni.getStorageSync(key)\n\n        let desc:string = typeof this.apiGetData\n        if(\"object\" == desc){\n          desc = desc  + \": \" + JSON.stringify(this.apiGetData)\n        }else{\n          desc = desc  + \": \" + this.apiGetData\n        }\n\r\n        uni.showModal({\r\n          title: '读取数据成功',\r\n          content:  desc,\r\n          showCancel: false,\r\n        })\r\n      }\r\n    },\r\n    setStorage: function () {\r\n      var key = this.key\r\n      var data = this.data\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '保存数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        uni.setStorage({\r\n          key: key,\r\n          data: data,\r\n          success: () => {\r\n            uni.showModal({\r\n              title: '存储数据成功',\r\n              showCancel: false,\r\n            })\r\n          },\r\n          fail: () => {\r\n            uni.showModal({\r\n              title: '储存数据失败!',\r\n              showCancel: false,\r\n            })\r\n          },\r\n        })\r\n      }\r\n    },\r\n    setStorageSync: function () {\r\n      var key = this.key\r\n      var data = this.data\r\n      if (key.length == 0) {\r\n        uni.showModal({\r\n          title: '保存数据失败',\r\n          content: 'key 不能为空',\r\n          showCancel: false,\r\n        })\r\n      } else {\r\n        uni.setStorageSync(key, data)\r\n        uni.showModal({\r\n          title: '存储数据成功',\r\n          showCancel: false,\r\n        })\r\n      }\r\n    },\r\n    removeStorage: function () {\r\n      uni.removeStorage({\r\n        key: this.key,\r\n        success: () => {\r\n          uni.showModal({\r\n            title: '移除数据成功',\r\n            showCancel: false,\r\n          })\r\n        },\r\n        fail: () => {\r\n          uni.showModal({\r\n            title: '移除数据失败',\r\n            showCancel: false,\r\n          })\r\n        },\r\n      })\r\n    },\r\n    removeStorageSync: function () {\r\n      uni.removeStorageSync(this.key)\r\n      uni.showModal({\r\n        title: '移除数据成功',\r\n        showCancel: false,\r\n      })\r\n    },\r\n    clearStorage: function () {\r\n      this.key = ''\r\n      this.data = ''\r\n      uni.clearStorage({\r\n        success: function (_) {\r\n          uni.showModal({\r\n            title: '清除数据成功',\r\n            showCancel: false,\r\n          })\r\n        },\r\n        fail: function (_) {\r\n          uni.showModal({\r\n            title: '清除数据失败',\r\n            showCancel: false,\r\n          })\r\n        },\r\n      })\r\n    },\r\n    clearStorageSync: function () {\r\n      this.key = ''\r\n      this.data = ''\r\n      uni.clearStorageSync()\r\n      uni.showModal({\r\n        title: '清除数据成功',\r\n        content: ' ',\r\n        showCancel: false,\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.btn-setstorage {\r\n  background-color: #007aff;\r\n  color: #ffffff;\r\n}\r\n\r\n.button-sp-area {\r\n  flex-direction: row;\r\n  margin: 0 auto;\r\n}\r\n</style>\r\n\n```"},"createWebviewContext":{"name":"## uni.createWebviewContext(webviewId, component?) @createwebviewcontext","description":"创建 web-view 组件的上下文对象，用于操作 web-view 的行为。","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| webviewId | string | 是 | - | - |\n| component | ComponentPublicInstance | 否 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [WebviewContext](#webviewcontext-values) | 否 | \n\n#### WebviewContext 属性值 @webviewcontext-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| back | () => void | 是 | - | 后退到 web-view 组件网页加载历史的上一页，如果不存在上一页则没有任何效果。 |\n| forward | () => void | 是 | - | 前进到 web-view 组件网页加载历史的下一页，如果不存在下一页则没有任何效果。 |\n| reload | () => void | 是 | - | 重新加载 web-view 组件当前页面。 |\n| stop | () => void | 是 | - | 停止加载 web-view 组件当前网页，该方法不能阻止已经加载的 html 文档，但是能够阻止未完成的图片及延迟加载的资源。 |\n| evalJS | (js: string) => void | 是 | - | 在网页中执行指定的js脚本，在 uvue 页面中可通过此方法向 web-view 组件加载的页面发送数据 |\n","compatibility":"","tutorial":""},"createVideoContext":{"name":"## uni.createVideoContext(videoId, component?) @createvideocontext","description":"创建并返回 video 上下文 videoContext 对象","param":"### 参数 \n\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| videoId | string | 是 | - | - |\n| component | ComponentPublicInstance | 否 | - | - |","returnValue":"### 返回值 \n\n| 类型 | 必备 |\n| :- | :- |\n| [VideoContext](#videocontext-values) | 否 | \n\n#### VideoContext 属性值 @videocontext-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| play | () => void | 是 | - | 播放 |\n| pause | () => void | 是 | - | 暂停 |\n| seek | (position: number) => void | 是 | - | 跳转到指定位置 |\n| stop | () => void | 是 | - | 停止视频 |\n| sendDanmu | (danmu: [Danmu](#danmu-values)) => void | 是 | - | 发送弹幕 |\n| playbackRate | (rate: number) => void | 是 | - | 设置倍速播放 |\n| requestFullScreen | (direction?: [RequestFullScreenOptions](#requestfullscreenoptions-values)) => void | 是 | - | 进入全屏 |\n| exitFullScreen | () => void | 是 | - | 退出全屏 |\n\n##### Danmu 属性值 @danmu-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| text | string | 否 | - |  弹幕文字 |\n| color | string | 否 | - |  弹幕颜色 |\n| time | number | 否 | - |  显示时刻 |\n\n##### RequestFullScreenOptions 属性值 @requestfullscreenoptions-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | number | 否 | - |  direction - 0: 正常竖向 - 90: 屏幕逆时针90度 - -90: 屏幕顺时针90度 |\n\n##### VideoContext 兼容性 \n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| play | 4.4 | √ | 3.9.0 | - | - | - |\n| pause | 4.4 | √ | 3.9.0 | - | - | - |\n| seek | 4.4 | √ | 3.9.0 | - | - | - |\n| stop | 4.4 | √ | 3.9.0 | - | - | - |\n| sendDanmu | 4.4 | √ | 3.9.0 | - | - | - |\n| playbackRate | 4.4 | √ | 3.9.0 | - | - | - |\n| requestFullScreen | 4.4 | √ | 3.9.0 | - | - | - |\n| exitFullScreen | 4.4 | √ | 3.9.0 | - | - | - |\n","compatibility":"### createVideoContext 兼容性 \n| 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- |\n| 4.4 | √ | √ | - | - | - |\n","tutorial":"\n### 参见\n[createVideoContext](http://uniapp.dcloud.io/api/media/video-context?id=createVideoContext)\n"},"general_type":{"name":"## 通用类型\n","param":"### GeneralCallbackResult \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n"}}
\ No newline at end of file
diff --git a/docs/.vuepress/utils/utsComJson.json b/docs/.vuepress/utils/utsComJson.json
index 7c6da2f86..1d8417d78 100644
--- a/docs/.vuepress/utils/utsComJson.json
+++ b/docs/.vuepress/utils/utsComJson.json
@@ -1 +1 @@
-{"animation-view":{"name":"## animation-view","description":"Lottie 动画\n> 本 Component 是 uni ext component，需下载插件：[animation-view](https://ext.dcloud.net.cn/plugin?name=uni-animation-view)\n","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| path | String |  | 动画资源地址，目前只支持绝对路径 |\n| loop | Boolean | false | 动画是否循环播放 |\n| autoplay | Boolean | false | 动画是否自动播放 |\n| action | String | stop | 动画操作，可取值 play、pause、stop [action](#action-values) |\n| hidden | Boolean | false | 是否隐藏动画 |\n| @ended | Any | - | - |\n\n#### action @action-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| play | 播放 |\n| pause | 暂停 |\n| stop | 停止 |\n\n","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| animation-view | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| path | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/animation-view)\n- [插件市场](https://ext.dcloud.net.cn/plugin?id=10674)\n"},"button":{"name":"## button","description":"按钮","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| hover-class | ClassString | button-hover | 指定按下去的样式类。当 hover-class=\"none\" 时，没有点击态效果 |\n| hover-start-time | Number | 20 | 按住后多久出现点击态，单位毫秒 |\n| hover-stay-time | Number | 70 | 手指松开后点击态保留时间，单位毫秒 |\n| size | String | default | 按钮的大小 [size](#size-values) |\n| type | String | default | 按钮的样式类型 [type](#type-values) |\n| plain | Boolean | false | 按钮是否镂空，背景色透明 |\n\n#### size @size-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| default | 默认大小 |\n| mini | 小尺寸 |\n\n\n\n#### type @type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| default | 白色 |\n| primary | 蓝色 |\n| warn | 红色 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/button/button.uvue) \n ```html\n<script>\r\n  import { type ItemType } from '@/components/enum-data/enum-data.vue'\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: 'uni-app-x',\r\n        style: 'color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19;'\r\n      }\r\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    }\r\n  }\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <button :disabled=\"disabled_boolean\" :size=\"size_enum[size_enum_current].name\"\r\n      :type=\"type_enum[type_enum_current].name\" :plain=\"plain_boolean\" @click=\"button_click\"\r\n      @touchstart=\"button_touchstart\" @touchmove=\"button_touchmove\" @touchcancel=\"button_touchcancel\"\r\n      @touchend=\"button_touchend\" @tap=\"button_tap\" @longpress=\"button_longpress\" class=\"btn\"\r\n      :style=\"default_style ? style : ''\" :hover-class=\"default_style ? 'is-hover' : 'button-hover'\">\r\n      {{ text }}\r\n    </button>\r\n  </view>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content\">\r\n      <boolean-data :defaultValue=\"false\" title=\"按钮是否镂空，背景色透明\" @change=\"change_plain_boolean\"></boolean-data>\r\n      <boolean-data :defaultValue=\"false\" title=\"是否禁用\" @change=\"change_disabled_boolean\"></boolean-data>\r\n      <boolean-data :defaultValue=\"false\" title=\"修改默认样式和点击效果(高优先)\" @change=\"change_default_style\"></boolean-data>\r\n      <enum-data :items=\"size_enum\" title=\"按钮的大小\" @change=\"radio_change_size_enum\"></enum-data>\r\n      <enum-data :items=\"type_enum\" title=\"按钮的类型\" @change=\"radio_change_type_enum\"></enum-data>\r\n      <input-data :defaultValue=\"text\" title=\"按钮的文案\" type=\"text\" @confirm=\"confirm_text_input\"></input-data>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n  .main {\r\n    padding: 10rpx 0;\r\n    border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n    flex-direction: row;\r\n    justify-content: center;\r\n  }\r\n\r\n  .main .list-item {\r\n    width: 100%;\r\n    height: 200rpx;\r\n    border: 1px solid #666;\r\n  }\r\n\r\n  .is-hover {\r\n    color: rgba(255, 255, 255, 0.6);\r\n    background-color: #179b16;\r\n    border-color: #179b16;\r\n  }\r\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| button | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-class | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-start-time | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-stay-time | 5.0 | √ | √ | 10.0 | √ | x |\n| size | 5.0 | √ | √ | 10.0 | √ | x |\n| type | 5.0 | √ | √ | 10.0 | √ | x |\n| plain | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/button)\n"},"checkbox":{"name":"## checkbox","description":"多选项。在1组check-group中可选择多个","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String | - | checkbox 标识，选中时触发 checkbox-group 的 change 事件，并携带 checkbox 的 value |\n| checked | Boolean | false | 当前是否选中，可用来设置默认选中 |\n| color | ColorString | #007aff | checkbox的颜色 |\n| backgroundColor | ColorString | #ffffff | checkbox默认的背景颜色 |\n| borderColor | ColorString | #d1d1d1 | checkbox默认的边框颜色 |\n| activeBackgroundColor | ColorString | #ffffff | checkbox选中时的背景颜色 |\n| activeBorderColor | ColorString | #d1d1d1 | checkbox选中时的边框颜色 |\n| iconColor | ColorString | #007aff | checkbox的图标颜色，优先级大于color属性 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/checkbox/checkbox.uvue) \n ```html\n<script>\r\ntype ItemType = {\r\n\tvalue : string\r\n\tname : string\r\n\tchecked : boolean\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\titems: [\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'CHN',\r\n\t\t\t\t\tname: '中国',\r\n\t\t\t\t\tchecked: true,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'USA',\r\n\t\t\t\t\tname: '美国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'BRA',\r\n\t\t\t\t\tname: '巴西',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'JPN',\r\n\t\t\t\t\tname: '日本',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'ENG',\r\n\t\t\t\t\tname: '英国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'FRA',\r\n\t\t\t\t\tname: '法国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t] as ItemType[],\r\n\r\n\t\t\ttext: '未选中',\r\n\t\t\twrapText: 'uni-app x，终极跨平台方案\\nuts，大一统语言',\r\n\t\t\tvalue: [] as string[],\r\n\t\t\tdisabled: true,\r\n\t\t\tchecked: true,\r\n\t\t\tcolor: '#007aff',\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tchecked_boolean: false,\r\n\t\t\tdisabled_boolean: false,\r\n\t\t\tcolor_input: \"#007aff\",\r\n\t\t\tbackgroundColor_input: \"#ffffff\",\r\n\t\t\tborderColor_input: \"#d1d1d1\",\r\n\t\t\tactiveBackgroundColor_input: \"#ffffff\",\r\n\t\t\tactiveBorderColor_input: \"#d1d1d1\",\r\n\t\t\ticonColor_input: \"#007aff\"\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tcheckboxChange: function (e : CheckboxGroupChangeEvent) {\r\n\t\t\tconst selectedNames : string[] = []\r\n\t\t\tthis.items.forEach((item) => {\r\n\t\t\t\tif (e.detail.value.includes(item.value)) {\r\n\t\t\t\t\tselectedNames.push(item.name)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t\tuni.showToast({\r\n\t\t\t\ticon: 'none',\r\n\t\t\t\ttitle: '当前选中:' + selectedNames.join(','),\r\n\t\t\t})\r\n\t\t},\r\n\t\ttestChange: function (e : CheckboxGroupChangeEvent) {\r\n\t\t\tthis.value = e.detail.value\r\n\t\t},\r\n\t\tcheckbox_click() { console.log(\"组件被点击时触发\") },\r\n\t\tcheckbox_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tcheckbox_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tcheckbox_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tcheckbox_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tcheckbox_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tcheckbox_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\tchange_checked_boolean(checked : boolean) { this.checked_boolean = checked },\r\n\t\tchange_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\r\n\t\tconfirm_color_input(value : string) { this.color_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tconfirm_borderColor_input(value : string) { this.borderColor_input = value },\r\n\t\tconfirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\r\n\t\tconfirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\r\n\t\tconfirm_iconColor_input(value : string) { this.iconColor_input = value }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <checkbox\r\n      :disabled=\"disabled_boolean\"\r\n      :checked=\"checked_boolean\"\r\n      :color=\"color_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :borderColor=\"borderColor_input\"\r\n      :activeBackgroundColor=\"activeBackgroundColor_input\"\r\n      :activeBorderColor=\"activeBorderColor_input\"\r\n      :iconColor=\"iconColor_input\"\r\n      @click=\"checkbox_click\"\r\n      @touchstart=\"checkbox_touchstart\"\r\n      @touchmove=\"checkbox_touchmove\"\r\n      @touchcancel=\"checkbox_touchcancel\"\r\n      @touchend=\"checkbox_touchend\"\r\n      @tap=\"checkbox_tap\"\r\n      @longpress=\"checkbox_longpress\"\r\n      ><text>uni-app-x</text></checkbox\r\n    >\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"当前是否选中，可用来设置默认选中\"\r\n        @change=\"change_checked_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否禁用\"\r\n        @change=\"change_disabled_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"#007aff\"\r\n        title=\"checkbox的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_color_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"checkbox默认的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"checkbox默认的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_borderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"checkbox选中时的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBackgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"checkbox选中时的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBorderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#007aff\"\r\n        title=\"checkbox的图标颜色，优先级大于color属性\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_iconColor_input\"\r\n      ></input-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 默认样式 </text>\r\n        </view>\r\n        <view>\r\n          <checkbox-group\r\n            class=\"uni-flex uni-row checkbox-group\"\r\n            @change=\"testChange\"\r\n            style=\"flex-wrap: wrap\"\r\n          >\r\n            <checkbox\r\n              value=\"cb\"\r\n              :checked=\"checked\"\r\n              :color=\"color\"\r\n              style=\"margin-right: 30rpx\"\r\n              class=\"checkbox cb\"\r\n              >选中\r\n            </checkbox>\r\n            <checkbox\r\n              value=\"cb1\"\r\n              style=\"margin-right: 30rpx\"\r\n              class=\"checkbox cb1\"\r\n              >{{ text }}</checkbox\r\n            >\r\n            <checkbox value=\"cb2\" :disabled=\"disabled\" class=\"checkbox cb2\"\r\n              >禁用</checkbox\r\n            >\r\n            <checkbox\r\n              value=\"cb3\"\r\n              style=\"margin-top: 20rpx\"\r\n              class=\"checkbox cb3\"\r\n            >\r\n              {{ wrapText }}\r\n            </checkbox>\r\n          </checkbox-group>\r\n        </view>\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 不同颜色和尺寸的checkbox </text>\r\n        </view>\r\n        <view>\r\n          <checkbox-group class=\"uni-flex uni-row checkbox-group\">\r\n            <checkbox\r\n              value=\"cb1\"\r\n              :checked=\"true\"\r\n              color=\"#FFCC33\"\r\n              style=\"transform: scale(0.7); margin-right: 30rpx\"\r\n              class=\"checkbox\"\r\n              >选中\r\n            </checkbox>\r\n            <checkbox\r\n              value=\"cb\"\r\n              color=\"#FFCC33\"\r\n              style=\"transform: scale(0.7)\"\r\n              class=\"checkbox\"\r\n              >未选中</checkbox\r\n            >\r\n          </checkbox-group>\r\n        </view>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 推荐展示样式 </text>\r\n        </view>\r\n      </view>\r\n      <view class=\"uni-list uni-common-pl\">\r\n        <checkbox-group @change=\"checkboxChange\" class=\"checkbox-group\">\r\n          <checkbox\r\n            class=\"uni-list-cell uni-list-cell-pd checkbox\"\r\n            v-for=\"(item, index) in items\"\r\n            :key=\"item.value\"\r\n            :value=\"item.value\"\r\n            :checked=\"item.checked\"\r\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\"\r\n          >\r\n            {{ item.name }}\r\n          </checkbox>\r\n        </checkbox-group>\r\n      </view>\r\n    </view>\r\n\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.uni-list-cell {\r\n  justify-content: flex-start;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| checkbox | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| checked | 5.0 | √ | √ | 10.0 | √ | x |\n| color | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| borderColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBackgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBorderColor | 5.0 | x | √ | 10.0 | x | x |\n| iconColor | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/checkbox)\n"},"checkbox-group":{"name":"## checkbox-group","description":"多项组，内部由多个checkbox组成","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| @change | (event: [CheckboxGroupChangeEvent](#checkboxgroupchangeevent)) => void | - | checkbox-group中选中项发生改变是触发 change 事件，detail = {value:[选中的checkbox的value的数组\\]} |","event":"\n### 事件\n#### CheckboxGroupChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### CheckboxGroupChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| checkbox-group | 5.0 | √ | √ | 10.0 | √ | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [checkbox](#checkbox)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/checkbox)\n"},"image":{"name":"## image","description":"图片","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| src | ImageURIString | - | 图片资源地址 |\n| mode | String | scaleToFill | 图片裁剪、缩放的模式 [mode](#mode-values) |\n| fade-show | Boolean | false | 图片显示动画效果 |\n| @error | (event: [ImageErrorEvent](#imageerrorevent)) => void | - | 图片加载错误时触发，event.detail = { errMsg } |\n| @load | (event: [ImageLoadEvent](#imageloadevent)) => void | - | 图片加载完成时触发，event.detail = { width: '图片宽度px', height: '图片高度px' } |\n\n#### mode @mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| scaleToFill | 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 |\n| aspectFit | 保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。 |\n| aspectFill | 保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取 |\n| widthFix | 宽度不变，高度自动变化，保持原图宽高比不变 |\n| heightFix | 高度不变，宽度自动变化，保持原图宽高比不变 |\n| top | 不缩放图片，只显示图片的顶部区域 |\n| bottom | 不缩放图片，只显示图片的底部区域 |\n| center | 不缩放图片，只显示图片的中间区域 |\n| left | 不缩放图片，只显示图片的左边区域 |\n| right | 不缩放图片，只显示图片的右边区域 |\n| top left | 不缩放图片，只显示图片的左上边区域 |\n| top rigth | 不缩放图片，只显示图片的右上边区域 |\n| bottom left | 不缩放图片，只显示图片的左下边区域 |\n| bottom right | 不缩放图片，只显示图片的右下边区域 |\n\n","event":"\n### 事件\n#### ImageErrorEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ImageErrorEventdetail](#imageerroreventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ImageErrorEventdetail 属性值 @imageerroreventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ImageLoadEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ImageLoadEventdetail](#imageloadeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ImageLoadEventdetail 属性值 @imageloadeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | number | 是 | - |  图片宽度 |\n| height | number | 是 | - |  图片高度 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/image/image.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t<view class=\"uni-center\" style=\"background:#FFFFFF;\">\r\n\t\t\t\t<image class=\"image\" :fade-show=\"true\" mode=\"widthFix\" :src=\"imageSrc\" @error=\"error\"\r\n\t\t\t\t\t@load=\"load\"></image>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageFormat\">图片格式示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageMode\">图片缩放模式示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imagePath\">图片路径示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageLarge\">大图示例</button>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'image',\n\t\t\t\timageSrc: \"/static/test-image/logo.png\",\n\t\t\t\tloadError: false\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\terror(event : ImageErrorEvent) {\n\t\t\t\tthis.loadError = true\r\n\t\t\t\tconsole.log(event.type, event.detail);\r\n\t\t\t},\r\n\t\t\tload(event : ImageLoadEvent) {\r\n\t\t\t\tconsole.log(event.type, event.detail);\r\n\t\t\t},\r\n\t\t\timageFormat() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-format'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timageMode() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-mode'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timagePath() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-path'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timageLarge() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-large'\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n<style>\r\n\t.image {\r\n\t\tmargin: 40rpx auto;\r\n\t\twidth: 200rpx;\r\n\t}\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| image | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| src | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| mode | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| fade-show | 5.0 | √ | 3.9+ | 9.0 | x | x |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/image)\n"},"input":{"name":"## input","description":"输入框","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String |  | 输入框的初始内容 |\n| type | String | text | input的类型 [type](#type-values) |\n| password | Boolean | false | 是否是密码类型 |\n| placeholder | String |  | 输入框为空时占位符 |\n| placeholder-style | String |  | 指定 placeholder 的样式 |\n| placeholder-class | String |  | 指定 placeholder 的样式类 |\n| maxlength | Number | 140 | 最大输入长度，设置为 -1 的时候不限制最大长度 |\n| cursor-spacing | Number | 0 | 指定光标与键盘的距离，单位 px 。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| auto-focus | Boolean | false | 自动获取焦点 |\n| focus | Boolean | false | 获取焦点 |\n| confirm-type | String | done | 设置键盘右下角按钮的文字 [confirm-type](#confirm-type-values) |\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| @input | (event: [InputEvent](#inputevent)) => void | - | 当键盘输入时，触发input事件，event.detail = {value, cursor}，处理函数可以直接 return 一个字符串，将替换输入框的内容。 |\n| @focus | (event: [InputFocusEvent](#inputfocusevent)) => void | - | 输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持 |\n| @blur | (event: [InputBlurEvent](#inputblurevent)) => void | - | 输入框失去焦点时触发，event.detail = {value: value} |\n| @keyboardheightchange | (event: [InputKeyboardHeightChangeEvent](#inputkeyboardheightchangeevent)) => void | - | 键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration} |\n| @confirm | (event: [InputConfirmEvent](#inputconfirmevent)) => void | - | 点击完成按钮时触发，event.detail = {value: value} |\n\n#### type @type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| text | 文本输入键盘 |\n| number | 数字输入键盘 |\n| digit | 带小数点数字输入键盘 |\n| tel | 电话输入键盘 |\n\n\n\n#### confirm-type @confirm-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| send | 发送 |\n| search | 搜索 |\n| next | 下一个 |\n| go | 前往 |\n| done | 完成 |\n\n","event":"\n### 事件\n#### InputEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputEventdetail](#inputeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputEventdetail 属性值 @inputeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  光标的位置 |\n| keyCode | number | 是 | - |  输入字符的Unicode值 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputFocusEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputFocusEventdetail](#inputfocuseventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputFocusEventdetail 属性值 @inputfocuseventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputBlurEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputBlurEventdetail](#inputblureventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputBlurEventdetail 属性值 @inputblureventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputKeyboardHeightChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputKeyboardHeightChangeEventdetail](#inputkeyboardheightchangeeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputKeyboardHeightChangeEventdetail 属性值 @inputkeyboardheightchangeeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| duration | number | 是 | - |  持续时间 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputConfirmEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputConfirmEventdetail](#inputconfirmeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputConfirmEventdetail 属性值 @inputconfirmeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/input/input.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n  <!-- #endif -->\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-common-mt uni-padding-wrap\">\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置输入框的初始内容</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-default\" value=\"hello uni-app x\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">type取值（不同输入法表现可能不一致）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-text\" type=\"text\" placeholder=\"文本输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-number\" type=\"number\" placeholder=\"数字输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-digit\" type=\"digit\" placeholder=\"带小数点的数字输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-tel\" :type=\"inputTypeTel\" placeholder=\"电话输入键盘\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">密码输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-password\" :password=\"inputPassword\" :value=\"inputPasswordValue\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">占位符样式</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-placeholder1\" :placeholder-style=\"inputPlaceHolderStyle\" placeholder=\"占位符文字颜色为红色\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-placeholder2\" :placeholder-class=\"inputPlaceHolderClass\" placeholder=\"占位符背景色为绿色\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置禁用输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-disable\" :disabled=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置最大输入长度</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-maxlength\" :maxlength=\"10\" placeholder=\"最大输入长度为10\" :value=\"inputMaxLengthValue\" @input=\"onMaxLengthInput\" :focus=\"inputMaxLengthFocus\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置光标与键盘的距离</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :cursor-spacing=\"1000\" placeholder=\"光标与键盘的距离为1000px\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">自动获取焦点</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-focus\" :focus=\"focus\" @keyboardheightchange=\"inputFocusKeyBoardChange\"/>\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">confirm-type取值（不同输入法表现可能不一致）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-send\" confirmType=\"send\" placeholder=\"键盘右下角按钮显示为发送\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-search\" confirmType=\"search\" placeholder=\"键盘右下角按钮显示为搜索\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-next\" confirmType=\"next\" placeholder=\"键盘右下角按钮显示为下一个\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-go\" confirmType=\"go\" placeholder=\"键盘右下角按钮显示为前往\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-done\" confirmType=\"done\" placeholder=\"键盘右下角按钮显示为完成\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">点击键盘右下角按钮时保持键盘不收起</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :confirm-hold=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\" @click=\"setCursor(4)\">\r\n          <text class=\"uni-title-text\">设置输入框聚焦时光标的位置（点击生效）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input ref=\"input\" class=\"uni-input\" value=\"0123456789\" :cursor=\"cursor\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\" @click=\"setSelection(0, 4)\">\r\n          <text class=\"uni-title-text\">设置输入框聚焦时光标的起始位置和结束位置（点击生效）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input ref=\"input2\" class=\"uni-input\" value=\"0123456789\" :selection-start=\"selectionStart\" :selection-end=\"selectionEnd\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">键盘弹起时，自动上推页面</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :adjust-position=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">input事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"inputEventDetail\">{{inputEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @input=\"onInput\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">focus事件和blur事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"focusAndBlurEventDetail\">{{focusAndBlurEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @focus=\"onFocus\" @blur=\"onBlur\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">confirm事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"confirmEventDetail\">{{confirmEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @confirm=\"onConfirm\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">keyboardheightchange事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"keyboardHeightChangeEventDetail\">{{keyboardHeightChangeEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @keyboardheightchange=\"onKeyborardHeightChange\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">带清除按钮的输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" placeholder=\"带清除按钮的输入框\" :value=\"inputClearValue\" @input=\"clearInput\" />\r\n          <image class=\"uni-icon\" src=\"/static/icons/clear.png\" v-if=\"showClearIcon\" @click=\"clearIcon\">\r\n          </image>\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">可查看密码的输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" placeholder=\"请输入密码\" :password=\"showPassword\" />\r\n          <image class=\"uni-icon\" :src=\"!showPassword ? '/static/icons/eye-active.png' : '/static/icons/eye.png'\" @click=\"changePassword\"></image>\r\n        </view>\r\n      </view>\r\n    </view>\r\n  <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'input',\r\n        showClearIcon: false,\r\n        inputClearValue: '',\r\n        showPassword: true,\r\n        cursor: -1,\r\n        selectionStart: -1,\r\n        selectionEnd: -1,\r\n        inputEventDetail: '',\r\n        focusAndBlurEventDetail: '',\r\n        confirmEventDetail: '',\r\n        keyboardHeightChangeEventDetail: '',\r\n        focus: true,\r\n        inputPassword: true,\r\n        inputTypeTel: \"tel\",\r\n        inputPlaceHolderStyle: \"color:red\",\r\n        inputPlaceHolderClass: \"uni-input-placeholder-class\",\n        inputMaxLengthValue:\"\",\n        onMaxLengthInputValue:\"\",\n        inputMaxLengthFocus:false,\n        inputPasswordValue:\"\",\n        inputFocusKeyBoardChangeValue:true\r\n      }\r\n    },\r\n    methods: {\n      inputFocusKeyBoardChange(e:InputKeyboardHeightChangeEvent) {\n        this.inputFocusKeyBoardChangeValue = e.detail.height > 50\n      },\n      onMaxLengthInput(event:InputEvent) {\n        this.onMaxLengthInputValue = event.detail.value\n      },\r\n      setCursor: function (cursor : number) {\r\n        (this.$refs['input'] as Element).focus();\r\n        this.cursor = cursor;\r\n      },\r\n      setSelection: function (selectionStart : number, selectionEnd : number) {\r\n        (this.$refs['input2'] as Element).focus();\r\n        this.selectionStart = selectionStart;\r\n        this.selectionEnd = selectionEnd;\r\n      },\r\n      clearInput: function (event : InputEvent) {\r\n        this.inputClearValue = event.detail.value\r\n        if (event.detail.value.length > 0) {\r\n          this.showClearIcon = true\r\n        } else {\r\n          this.showClearIcon = false\r\n        }\r\n      },\r\n      clearIcon: function () {\r\n        this.inputClearValue = ''\r\n        this.showClearIcon = false\r\n      },\r\n      changePassword: function () {\r\n        this.showPassword = !this.showPassword\r\n      },\r\n      onInput: function (event : InputEvent) {\r\n        console.log(\"键盘输入\", JSON.stringify(event.detail));\r\n        this.inputEventDetail = JSON.stringify(event.detail)\r\n      },\r\n      onFocus: function (event : InputFocusEvent) {\r\n        console.log(\"输入框聚焦\", JSON.stringify(event.detail));\r\n        this.focusAndBlurEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onBlur: function (event : InputBlurEvent) {\r\n        console.log(\"输入框失去焦点\", JSON.stringify(event.detail));\r\n        this.focusAndBlurEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onConfirm: function (event : InputConfirmEvent) {\r\n        console.log(\"点击完成按钮\", JSON.stringify(event.detail));\r\n        this.confirmEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onKeyborardHeightChange: function (event : InputKeyboardHeightChangeEvent) {\r\n        console.log(\"键盘高度发生变化\", JSON.stringify(event.detail));\r\n        this.keyboardHeightChangeEventDetail = JSON.stringify(event.detail);\r\n      },\n      test_check_input_value():number {\n        return this.onMaxLengthInputValue.length\n      }\r\n    }\r\n  }\r\n</script>\r\n\r\n<style scoped>\r\n  .uni-input-wrapper {\r\n    display: flex;\r\n    padding: 8px 13px;\r\n    margin: 10rpx 0;\r\n    flex-direction: row;\r\n    flex-wrap: nowrap;\r\n    background-color: #ffffff;\r\n  }\r\n\r\n  .uni-input {\r\n    height: 28px;\r\n    font-size: 15px;\r\n    padding: 0px;\r\n    flex: 1;\r\n    background-color: #ffffff;\r\n  }\r\n\r\n  .uni-icon {\r\n    width: 24px;\r\n    height: 24px;\r\n  }\r\n\r\n  .uni-input-placeholder-class {\r\n    background-color: green;\r\n  }\n  .uni-input-placeholder-class-ts {\n    background-color: orange;\n  }\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| input | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/input)\n"},"list-item":{"name":"## list-item","description":"list-view组件的唯一合法子组件。每个item是一行","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| type | Number | 0 | 对应list-item的类型 list-view 将对同类型条目进行复用，所以合理的类型拆分，可以很好地提升 list-view 性能 |","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| list-item | 5.0 | x | 3.9+ | 9.0 | x | - |\n| type | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/uni-app-x/component/list-view#list-item)\n"},"list-view":{"name":"## list-view","description":"列表组件","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| scroll-x | Boolean | false | 允许横向滚动，不支持同时设置scroll-y属性为true，同时设置true时scroll-y生效 |\n| scroll-y | Boolean | true | 允许纵向滚动，不支持同时设置scroll-x属性为true，同时设置true时scroll-y生效 |\n| rebound | Boolean | true | 控制是否回弹效果 |\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 | - | 值应为某子元素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！list-view暂时不支持使用自定义样式 |\n| refresher-background | String | #FFF | 设置下拉刷新区域背景颜色 |\n| refresher-triggered | Boolean | false | 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 |\n| custom-nested-scroll | Boolean | - | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| @refresherpulling | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被触发 |\n| @refresherrestore | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被复位 |\n| @refresherabort | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被中止 |\n| @scrolltoupper | (event: [ScrollToUpperEvent](#scrolltoupperevent)) => void | - | 滚动到顶部/左边，会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [ScrollToLowerEvent](#scrolltolowerevent)) => void | - | 滚动到底部/右边，会触发 scrolltolower 事件 |\n| @scroll | (event: [ScrollEvent](#scrollevent)) => void | - | 滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |","event":"\n### 事件\n#### RefresherEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RefresherEventdetail](#refreshereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RefresherEventdetail 属性值 @refreshereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToUpperEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToUpperEventdetail](#scrolltouppereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToUpperEventdetail 属性值 @scrolltouppereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 top 或 left |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToLowerEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToLowerEventdetail](#scrolltolowereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToLowerEventdetail 属性值 @scrolltolowereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 bottom 或 right |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollEventdetail](#scrolleventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollEventdetail 属性值 @scrolleventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 是 | - |  竖向滚动的距离 |\n| scrollLeft | number | 是 | - |  横向滚动的距离 |\n| scrollHeight | number | 是 | - |  滚动区域的高度 |\n| scrollWidth | number | 是 | - |  滚动区域的宽度 |\n| deltaY | number | 是 | - |  当次滚动事件竖向滚动量 |\n| deltaX | number | 是 | - |  当次滚动事件横向滚动量 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/list-view/list-view.uvue) \n ```html\n<script>\n  import { type ItemType } from '@/components/enum-data/enum-data.vue'\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: true,\n        rebound_boolean: true,\n        scroll_y_boolean: true,\n        scroll_x_boolean: false,\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<string>,\n        size_enum: [{ \"value\": 0, \"name\": \"item---0\" }, { \"value\": 3, \"name\": \"item---3\" }] as ItemType[],\n        scrollIntoView: \"\",\n        refresherrefresh: false\n      }\n    },\n    onLoad() {\n      let lists : Array<string> = []\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() { console.log(\"下拉刷新控件被下拉\") },\n      list_view_refresherrefresh() {\n        console.log(\"下拉刷新被触发 \")\n        this.refresherrefresh = true\n        this.refresher_triggered_boolean = true\n        setTimeout(function(){\n        \tthis.refresher_triggered_boolean = false\n        }, 1500)\n      },\n      list_view_refresherrestore() {\n        this.refresherrefresh = false\n        console.log(\"下拉刷新被复位\")\n      },\n      list_view_refresherabort() { console.log(\"下拉刷新被中止\") },\n      list_view_scrolltoupper(e:ScrollToUpperEvent) { console.log(\"滚动到顶部/左边，会触发 scrolltoupper 事件  direction=\"+e.detail.direction) },\n      list_view_scrolltolower(e:ScrollToLowerEvent) { console.log(\"滚动到底部/右边，会触发 scrolltolower 事件  direction=\"+e.detail.direction) },\n      list_view_scroll() { console.log(\"滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}\") },\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_rebound_boolean(checked : boolean) { this.rebound_boolean = checked },\n      change_scroll_y_boolean(checked : boolean) { this.scroll_y_boolean = checked },\n      change_scroll_x_boolean(checked : boolean) { this.scroll_x_boolean = checked },\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 },\r\n      //自动化测试例专用\n      check_scroll_height(): Boolean {\r\n        var listElement = this.$refs[\"listview\"] as Element\n        console.log(\"check_scroll_height--\"+listElement.scrollHeight)\r\n        if(listElement.scrollHeight > 2000) {\r\n          return true\r\n        }\r\n        return false\r\n      },\n      //自动化测试例专用\r\n      check_scroll_width(): Boolean {\r\n        var listElement = this.$refs[\"listview\"] as Element\n        console.log(\"check_scroll_width\"+listElement.scrollWidth)\n        if(listElement.scrollWidth > 2000) {\n          return true\n        }\r\n        return false\r\n      }\n    }\n  }\n</script>\n\n<template>\n  <view class=\"main\">\n    <list-view :scroll-x=\"scroll_x_boolean\" :scroll-y=\"scroll_y_boolean\" :rebound=\"rebound_boolean\"\n      :upper-threshold=\"upper_threshold_input\" :lower-threshold=\"lower_threshold_input\" :scroll-top=\"scroll_top_input\"\n      :scroll-left=\"scroll_left_input\" :show-scrollbar=\"show_scrollbar_boolean\" :scroll-into-view=\"scrollIntoView\"\n      :scroll-with-animation=\"scroll_with_animation_boolean\" :refresher-enabled=\"refresher_enabled_boolean\"\n      :refresher-background=\"refresher_background_input\" :refresher-triggered=\"refresher_triggered_boolean\"\n      @click=\"list_view_click\" @touchstart=\"list_view_touchstart\" @touchmove=\"list_view_touchmove\"\n      @touchcancel=\"list_view_touchcancel\" @touchend=\"list_view_touchend\" @tap=\"list_view_tap\"\n      @longpress=\"list_view_longpress\" @refresherpulling=\"list_view_refresherpulling\"\n      @refresherrefresh=\"list_view_refresherrefresh\" @refresherrestore=\"list_view_refresherrestore\"\n      @refresherabort=\"list_view_refresherabort\" @scrolltoupper=\"list_view_scrolltoupper\" ref=\"listview\" id=\"listview\"\n      @scrolltolower=\"list_view_scrolltolower\" @scroll=\"list_view_scroll\" style=\"width:100%;\">\n      <list-item\n        v-for=\"key in scrollData\" :key=\"key\" :id=\"key\" @click=\"list_item_click\" @touchstart=\"list_item_touchstart\"\n        @touchmove=\"list_item_touchmove\" @touchcancel=\"list_item_touchcancel\" @touchend=\"list_item_touchend\"\n        @tap=\"list_item_tap\" @longpress=\"list_item_longpress\"\n        class=\"list-item\">\n        <text>{{key}}</text>\n      </list-item>\n    </list-view>\n  </view>\n\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex:1\">\n    <!-- #endif -->\n    <view class=\"content nvue\">\n      <boolean-data :defaultValue=\"false\" title=\"设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发\"\n        @change=\"change_refresher_triggered_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"开启下拉刷新\" @change=\"change_refresher_enabled_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否在设置滚动条位置时使用滚动动画，设置false没有滚动动画\"\n        @change=\"change_scroll_with_animation_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"控制是否出现滚动条\" @change=\"change_show_scrollbar_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"控制是否回弹效果\" @change=\"change_rebound_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"允许纵向滚动\" @change=\"change_scroll_y_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"允许横向滚动\" @change=\"change_scroll_x_boolean\"></boolean-data>\n      <input-data defaultValue=\"50\" title=\"距顶部/左边多远时（单位px），触发 scrolltoupper 事件\" type=\"number\"\n        @confirm=\"confirm_upper_threshold_input\"></input-data>\n      <input-data defaultValue=\"50\" title=\"距底部/右边多远时（单位px），触发 scrolltolower 事件\" type=\"number\"\n        @confirm=\"confirm_lower_threshold_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"设置竖向滚动条位置\" type=\"number\" @confirm=\"confirm_scroll_top_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"设置横向滚动条位置\" type=\"number\" @confirm=\"confirm_scroll_left_input\"></input-data>\n      <input-data defaultValue=\"#FFF\" title=\"设置下拉刷新区域背景颜色\" type=\"text\"\n        @confirm=\"confirm_refresher_background_input\"></input-data>\n      <enum-data :items=\"size_enum\" title=\"通过id位置跳转\" @change=\"item_change_size_enum\"></enum-data>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<style>\n  .main {\n    max-height: 500rpx;\n    padding: 10rpx 0;\n    border-bottom: 1px solid rgba(0, 0, 0, .06);\n    flex-direction: row;\n    justify-content: center;\n  }\n\n  .main .list-item {\n    width: 750rpx;\n    height: 480rpx;\n    border: 1px solid #666;\n    background-color: #66ccff;\n    align-items: center;\n    justify-content: center;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| list-view | 5.0 | x | 3.9+ | 9.0 | x | - |\n| scroll-x | 5.0 | x | 3.9+ | - | - | - |\n| scroll-y | 5.0 | x | 3.9+ | - | - | - |\n| rebound | 5.0 | x | 3.9+ | - | - | - |\n| upper-threshold | 5.0 | x | 3.9+ | - | - | - |\n| lower-threshold | 5.0 | x | 3.9+ | - | - | - |\n| scroll-top | 5.0 | x | 3.9+ | - | - | - |\n| scroll-left | 5.0 | x | 3.9+ | - | - | - |\n| show-scrollbar | 5.0 | x | 3.9+ | - | - | - |\n| scroll-into-view | 5.0 | x | 3.9+ | - | - | - |\n| scroll-with-animation | 5.0 | x | 3.9+ | - | - | - |\n| refresher-enabled | 5.0 | x | 3.9+ | - | - | - |\n| refresher-threshold | 5.0 | x | 3.9+ | - | - | - |\n| refresher-max-drag-distance | 5.0 | x | 3.9+ | - | - | - |\n| refresher-default-style | 5.0 | x | 3.9+ | - | - | - |\n| refresher-background | 5.0 | x | 3.9+ | - | - | - |\n| refresher-triggered | 5.0 | x | 3.9+ | - | - | - |\n| custom-nested-scroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherpulling | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherrefresh | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherrestore | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherabort | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scrolltoupper | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scrolltolower | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"### 子组件 @children-tags \n - [list-item](#list-item)","reference":""},"navigator":{"name":"## navigator","description":"页面链接","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| target | String | - | 在哪个目标上发生跳转，默认当前应用 |\n| url | String\\|PageURIString | - | 当前应用内的跳转链接 |\n| open-type | String | - | 跳转方式 [open-type](#open-type-values) |\n| delta | Number | - | 当 open-type 为 navigateBack 时有效，表示回退的层数 |\n| app-id | String | - | 当target=\"miniProgram\"时有效，要打开的小程序 appId |\n| path | String | - | 当target=\"miniProgram\"时有效，打开的页面路径，如果为空则打开首页 |\n| extra-data | Object | - | 当target=\"miniProgram\"时有效，需要传递给目标应用的数据，目标应用可在 App.onLaunch()，App.onShow() 中获取到这份数据 |\n| version | String | - | 当target=\"miniProgram\"时有效，要打开的小程序版本，有效值 develop（开发版），trial（体验版），release（正式版），仅在当前小程序为开发版或体验版时此参数有效；如果当前小程序是体验版或正式版，则打开的小程序必定是正式版 |\n| animation-type | String | - | 当 open-type=\"navigateTo\" 或 open-type=\"navigateBack\" 时有效，窗口的显示/关闭的动画类型。 [animation-type](#animation-type-values) |\n| animation-duration | Number | - | 当 open-type=\"navigateTo\" 或 open-type=\"navigateBack\" 时有效，窗口的显示/关闭动画的持续时间。 |\n| hover-class | String | - | 指定按下去的样式类。当 hover-class=\"none\" 时，没有点击态效果 |\n| hover-stop-propagation | Boolean | - | 指定是否阻止本节点的祖先节点出现点击态 |\n| hover-start-time | Number | - | 按住后多久出现点击态，单位毫秒 |\n| hover-stay-time | Number | - | 手指松开后点击态保留时间，单位毫秒 |\n\n#### open-type @open-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| navigate | 对应 wx.navigateTo 或 wx.navigateToMiniProgram 的功能 |\n| redirect | 对应 wx.redirectTo 的功能 |\n| switchTab | 对应 wx.switchTab 的功能 |\n| reLaunch | 对应 wx.reLaunch 的功能 |\n| navigateBack | 对应 wx.navigateBack 的功能 |\n\n\n\n#### animation-type @animation-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| auto | 自动选择动画效果 |\n| none | 无动画效果 |\n| slide-in-right | 从右侧横向滑动效果 |\n| slide-in-left | 左侧横向滑动效果 |\n| slide-in-top | 从上侧竖向滑动效果 |\n| slide-in-bottom | 从下侧竖向滑动效果 |\n| fade-in | 从透明到不透明逐渐显示效果 |\n| zoom-out | 从小到大逐渐放大显示效果 |\n| zoom-fade-out | 从小到大逐渐放大并且从透明到不透明逐渐显示效果 |\n| pop-in | 从右侧平移入栈动画效果 |\n| slide-out-right | 横向向右侧滑出屏幕动画 |\n| slide-out-left | 横向向左侧滑出屏幕动画 |\n| slide-out-top | 竖向向上侧滑出屏幕动画 |\n| slide-out-bottom | 竖向向下侧滑出屏幕动画 |\n| fade-out | 从不透明到透明逐渐隐藏动画 |\n| zoom-in | 从大逐渐缩小关闭动画 |\n| zoom-fade-in | 从大逐渐缩小并且从不透明到透明逐渐隐藏关闭动画 |\n| pop-out | 从右侧平移出栈动画效果 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/navigator/navigator.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <navigator class=\"navigator navigate\" url=\"navigate?title=navigate\">\n        <button type=\"default\">跳转到新页面</button>\n      </navigator>\n      <navigator class=\"navigator redirect\" url=\"redirect?title=redirect\" open-type=\"redirect\">\n        <button type=\"default\">在当前页打开</button>\n      </navigator>\n    </view>\n  </view>\n</template>\n\n<script>\n  export default {\n    data() {\n      return {\n        title: 'navigator'\n      }\n    }\n  }\n</script>\n\n<style>\n  .navigator {\n    margin-bottom: 15px;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| navigator | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| url | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| open-type | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| path | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| animation-type | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| animation-duration | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/navigator)\n"},"picker-view-column":{"name":"## picker-view-column","description":"仅可放置于 picker-view 中，其子节点未继承 picker-view 的选中框的高度，需要自己设置高度并居中","attrubute":"","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| picker-view-column | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.net.cn/component/picker-view.html#picker-view-column)\n"},"picker-view":{"name":"## picker-view","description":"嵌入页面的滚动选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| value | Array\\<Number> | - | picker-view-column 选择的第几项 |\n| indicator-style | CSSString | - | 设置选择器中间选中框的样式 |\n| mask-top-style | CSSString | - | 设置蒙层上半部分的样式 |\n| mask-bottom-style | CSSString | - | 设置蒙层下半部分的样式 |\n| @change | (event: [PickerViewChangeEvent](#pickerviewchangeevent)) => void | - | 当滚动选择，value 改变时触发 change 事件，event.detail = {value: value}；value为数组，表示 picker-view 内的 picker-view-column 当前选择的是第几项（下标从 0 \t\t开始） |","event":"\n### 事件\n#### PickerViewChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### PickerViewChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/picker-view/picker-view.uvue) \n ```html\n<template>\r\n    <view>\r\n        <page-head :title=\"title\"></page-head>\r\n        <view class=\"uni-padding-wrap\">\r\n            <view class=\"uni-title\">\r\n                日期：{{year}}年{{month}}月{{day}}日\r\n            </view>\r\n        </view>\r\n        <picker-view class=\"picker-view\" :indicator-style=\"indicatorStyle\" :value=\"value\" @change=\"bindChange\"\r\n            :mask-top-style=\"maskTopStyle\" :mask-bottom-style=\"maskBottomStyle\">\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in years\" :key=\"index\"><text class=\"text\">{{item}}年</text></view>\r\n            </picker-view-column>\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in months\" :key=\"index\"><text class=\"text\">{{item}}月</text>\r\n                </view>\r\n            </picker-view-column>\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in days\" :key=\"index\"><text class=\"text\">{{item}}日</text></view>\r\n            </picker-view-column>\r\n        </picker-view>\r\n    </view>\r\n</template>\r\n\r\n<script lang=\"uts\">\r\n    export default {\r\n        data() {\r\n            const date = new Date()\n            const _years : number[] = []\n            const _year = date.getFullYear()\n            const _months : number[] = []\n            const _month : number = date.getMonth() + 1\n            const _days : number[] = []\n            const _day = date.getDate()\n            for (let i = 2000; i <= _year; i++) {\n                _years.push(i)\n            }\n            for (let i = 1; i <= 12; i++) {\n                _months.push(i)\n            }\n            for (let i = 1; i <= 31; i++) {\n                _days.push(i)\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: {\r\n\t\t\tclickView() {\r\n\t\t\t\t\r\n\t\t\t},\r\n            bindChange(e : PickerViewChangeEvent) {\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</script>\r\n\r\n<style>\r\n    .picker-view {\r\n        width: 100%;\r\n        height: 320px;\r\n        margin-top: 10px;\r\n    }\r\n\r\n    .item {\r\n        height: 50px;\r\n    }\r\n\r\n    .text {\r\n        line-height: 50px;\r\n        text-align: center;\r\n    }\r\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| picker-view | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| indicator-style | 5.0 | √ | √ | 10.0 | √ | x |\n| mask-top-style | 5.0 | x | √ | 10.0 | x | x |\n| mask-bottom-style | 5.0 | x | √ | 10.0 | x | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [picker-view-column](#picker-view-column)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/picker-view)\n"},"progress":{"name":"## progress","description":"进度条","attrubute":"### 属性 \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| color | ColorString | - | 进度条颜色 （请使用 activeColor） |\n| activeColor | ColorString | #09BB07 | 已选择的进度条的颜色 |\n| backgroundColor | ColorString | #EBEBEB | 未选择的进度条的颜色 |\n| active | Boolean | false | 进度条从左往右的动画 |\n| active-mode | String | backwards | backwards: 动画从头播；forwards：动画从上次结束点接着播 [active-mode](#active-mode-values) |\n| @activeend | (event: [ProgressActiveendEvent](#progressactiveendevent)) => void | - | 动画完成事件 |\n\n#### active-mode @active-mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| backwards | 动画从头播 |\n| forwards | 动画从上次结束点接着播 |\n\n","event":"\n### 事件\n#### ProgressActiveendEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ProgressActiveendEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| curPercent | number | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/progress/progress.uvue) \n ```html\n<script>\r\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'progress',\r\n\t\t\tpgList: [0, 0, 0, 0] as number[],\r\n\t\t\tcurPercent: 0,\r\n\t\t\tshowInfo: true,\r\n\t\t\tborderRadius: 0,\r\n\t\t\tfontSize: 16,\r\n\t\t\tstrokeWidth: 3,\r\n\t\t\tbackgroundColor: '#EBEBEB',\r\n\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tactive_boolean: false,\r\n\t\t\tshow_info_boolean: false,\r\n\t\t\tduration_input: 30,\r\n\t\t\tpercent_input: 0,\r\n\t\t\tstroke_width_input: 6,\r\n\t\t\tactiveColor_input: \"#09BB07\",\r\n\t\t\tbackgroundColor_input: \"#EBEBEB\",\r\n\t\t\tactive_mode_enum: [{ \"value\": 0, \"name\": \"backwards\" }, { \"value\": 1, \"name\": \"forwards\" }] as ItemType[],\r\n\t\t\tactive_mode_enum_current: 0\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tsetProgress() {\r\n\t\t\tthis.pgList = [20, 40, 60, 80] as number[]\r\n\t\t},\r\n\t\tclearProgress() {\r\n\t\t\tthis.pgList = [0, 0, 0, 0] as number[]\r\n\t\t},\r\n\t\tactiveend(e : ProgressActiveendEvent) {\r\n\t\t\tthis.curPercent = e.detail.curPercent\r\n\t\t},\r\n\t\tprogress_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tprogress_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tprogress_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tprogress_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tprogress_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tchange_active_boolean(checked : boolean) { this.active_boolean = checked },\r\n\t\tchange_show_info_boolean(checked : boolean) { this.show_info_boolean = checked },\r\n\t\tconfirm_duration_input(value : number) { this.duration_input = value },\r\n\t\tconfirm_percent_input(value : number) { this.percent_input = value },\r\n\t\tconfirm_stroke_width_input(value : number) { this.stroke_width_input = value },\r\n\t\tconfirm_activeColor_input(value : string) { this.activeColor_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tradio_change_active_mode_enum(checked : number) { this.active_mode_enum_current = checked }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <progress\r\n      :duration=\"duration_input\"\r\n      :percent=\"percent_input\"\r\n      :show-info=\"show_info_boolean\"\r\n      :stroke-width=\"stroke_width_input\"\r\n      :activeColor=\"activeColor_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :active=\"active_boolean\"\r\n      :active-mode=\"active_mode_enum[active_mode_enum_current].name\"\r\n      @touchstart=\"progress_touchstart\"\r\n      @touchmove=\"progress_touchmove\"\r\n      @touchcancel=\"progress_touchcancel\"\r\n      @touchend=\"progress_touchend\"\r\n      @tap=\"progress_tap\"\r\n      style=\"width: 80%\"\r\n    >\r\n      <text>uni-app-x</text>\r\n    </progress>\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"进度条从左往右的动画\"\r\n        @change=\"change_active_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"在进度条右侧显示百分比\"\r\n        @change=\"change_show_info_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"30\"\r\n        title=\"进度增加1%所需毫秒数\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_duration_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"0\"\r\n        title=\"百分比0~100\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_percent_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"6\"\r\n        title=\"进度条线的宽度，单位px\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_stroke_width_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#09BB07\"\r\n        title=\"已选择的进度条的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#EBEBEB\"\r\n        title=\"未选择的进度条的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <enum-data\r\n        :items=\"active_mode_enum\"\r\n        title=\"backwards: 动画从头播；forwards：动画从上次结束点接着播\"\r\n        @change=\"radio_change_active_mode_enum\"\r\n      ></enum-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[0]\"\r\n            :active=\"true\"\r\n            :border-radius=\"borderRadius\"\r\n            :show-info=\"showInfo\"\r\n            :font-size=\"fontSize\"\r\n            :stroke-width=\"strokeWidth\"\r\n            :background-color=\"backgroundColor\"\r\n            class=\"progress p\"\r\n            @activeend=\"activeend\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[1]\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p1\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[2]\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p2\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[3]\"\r\n            activeColor=\"#10AEFF\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p3\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-control\">\r\n          <button type=\"primary\" @click=\"setProgress\" class=\"button\">\r\n            设置进度\r\n          </button>\r\n          <button type=\"warn\" @click=\"clearProgress\" class=\"button\">\r\n            清除进度\r\n          </button>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.progress-box {\r\n  height: 50rpx;\r\n  margin-bottom: 60rpx;\r\n}\r\n\r\n.progress-cancel {\r\n  margin-left: 40rpx;\r\n}\r\n\r\n.button {\r\n  margin-top: 20rpx;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| progress | 5.0 | √ | √ | 10.0 | √ | x |\n| duration | 5.0 | √ | √ | 10.0 | √ | x |\n| percent | 5.0 | √ | √ | 10.0 | √ | x |\n| show-info | 5.0 | √ | √ | 10.0 | √ | x |\n| border-radius | 5.0 | √ | √ | 10.0 | √ | x |\n| font-size | 5.0 | √ | √ | 10.0 | √ | x |\n| stroke-width | 5.0 | √ | √ | 10.0 | √ | x |\n| activeColor | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | √ | √ | 10.0 | √ | x |\n| active | 5.0 | √ | √ | 10.0 | √ | x |\n| active-mode | 5.0 | √ | √ | 10.0 | √ | x |\n| @activeend | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/progress)\n"},"radio":{"name":"## radio","description":"单选项。在1组radio-group中只能选中1个","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String | - | \\<radio/> 标识。当该radio 选中时，radio-group的 change 事件会携带radio的value |\n| checked | Boolean | false | \\<radio/> 当前是否选中 |\n| color | ColorString | #007AFF | radio的颜色 |\n| backgroundColor | ColorString | #ffffff | radio默认的背景颜色 |\n| borderColor | ColorString | #d1d1d1 | radio默认的边框颜色 |\n| activeBackgroundColor | ColorString | #007AFF | radio选中时的背景颜色，优先级大于color属性 |\n| activeBorderColor | ColorString |  | radio选中时的边框颜色 |\n| iconColor | ColorString | #ffffff | radio的图标颜色 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/radio/radio.uvue) \n ```html\n<script>\r\ntype ItemType = {\r\n\tvalue : string\r\n\tname : string\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\titems: [\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'CHN',\r\n\t\t\t\t\tname: '中国',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'USA',\r\n\t\t\t\t\tname: '美国',\r\n\t\t\t\t},\r\n\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'BRA',\r\n\t\t\t\t\tname: '巴西',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'JPN',\r\n\t\t\t\t\tname: '日本',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'ENG',\r\n\t\t\t\t\tname: '英国',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'FRA',\r\n\t\t\t\t\tname: '法国',\r\n\t\t\t\t},\r\n\t\t\t] as ItemType[],\r\n\t\t\tcurrent: 0,\r\n\r\n\t\t\tvalue: '',\r\n\t\t\ttext: '未选中',\r\n\t\t\twrapText: 'uni-app x，终极跨平台方案\\nuts，大一统语言',\r\n\t\t\tdisabled: true,\r\n\t\t\tchecked: true,\r\n\t\t\tcolor: '#007aff',\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tchecked_boolean: false,\r\n\t\t\tdisabled_boolean: false,\r\n\t\t\tcolor_input: \"#007AFF\",\r\n\t\t\tbackgroundColor_input: \"#ffffff\",\r\n\t\t\tborderColor_input: \"#d1d1d1\",\r\n\t\t\tactiveBackgroundColor_input: \"#007AFF\",\r\n\t\t\tactiveBorderColor_input: \"\",\r\n\t\t\ticonColor_input: \"#ffffff\"\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tradioChange(e : RadioGroupChangeEvent) {\r\n\t\t\tconst selected = this.items.find((item) : boolean => {\r\n\t\t\t\treturn item.value == e.detail.value\r\n\t\t\t})\r\n\t\t\tuni.showToast({\r\n\t\t\t\ticon: 'none',\r\n\t\t\t\ttitle: '当前选中:' + selected?.name,\r\n\t\t\t})\r\n\t\t},\r\n\t\ttestChange(e : RadioGroupChangeEvent) {\r\n\t\t\tthis.value = e.detail.value\r\n\t\t},\r\n\t\tradio_click() { console.log(\"组件被点击时触发\") },\r\n\t\tradio_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tradio_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tradio_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tradio_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tradio_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tradio_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\tchange_checked_boolean(checked : boolean) { this.checked_boolean = checked },\r\n\t\tchange_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\r\n\t\tconfirm_color_input(value : string) { this.color_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tconfirm_borderColor_input(value : string) { this.borderColor_input = value },\r\n\t\tconfirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\r\n\t\tconfirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\r\n\t\tconfirm_iconColor_input(value : string) { this.iconColor_input = value }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <radio\r\n      :disabled=\"disabled_boolean\"\r\n      :checked=\"checked_boolean\"\r\n      :color=\"color_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :borderColor=\"borderColor_input\"\r\n      :activeBackgroundColor=\"activeBackgroundColor_input\"\r\n      :activeBorderColor=\"activeBorderColor_input\"\r\n      :iconColor=\"iconColor_input\"\r\n      @click=\"radio_click\"\r\n      @touchstart=\"radio_touchstart\"\r\n      @touchmove=\"radio_touchmove\"\r\n      @touchcancel=\"radio_touchcancel\"\r\n      @touchend=\"radio_touchend\"\r\n      @tap=\"radio_tap\"\r\n      @longpress=\"radio_longpress\"\r\n    >\r\n      <text>uni-app-x</text>\r\n    </radio>\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"<radio/> 当前是否选中\"\r\n        @change=\"change_checked_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否禁用\"\r\n        @change=\"change_disabled_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"#007AFF\"\r\n        title=\"radio的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_color_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"radio默认的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"radio默认的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_borderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#007AFF\"\r\n        title=\"radio选中时的背景颜色，优先级大于color属性\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBackgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"\"\r\n        title=\"radio选中时的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBorderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"radio的图标颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_iconColor_input\"\r\n      ></input-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 默认样式 </text>\r\n        </view>\r\n        <radio-group\r\n          class=\"uni-flex uni-row radio-group\"\r\n          @change=\"testChange\"\r\n          style=\"flex-wrap: wrap\"\r\n        >\r\n          <radio\r\n            value=\"r\"\r\n            :checked=\"checked\"\r\n            :color=\"color\"\r\n            style=\"margin-right: 30rpx\"\r\n            class=\"radio r\"\r\n            >选中\r\n          </radio>\r\n          <radio value=\"r1\" style=\"margin-right: 30rpx\" class=\"radio r1\">{{\r\n            text\r\n          }}</radio>\r\n          <radio value=\"r2\" :disabled=\"disabled\" class=\"radio r2\">禁用</radio>\r\n          <radio value=\"r3\" class=\"radio r3\" style=\"margin-top: 20rpx\">{{\r\n            wrapText\r\n          }}</radio>\r\n        </radio-group>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 不同颜色和尺寸的radio </text>\r\n        </view>\r\n        <radio-group class=\"uni-flex uni-row radio-group\">\r\n          <radio\r\n            value=\"r1\"\r\n            :checked=\"true\"\r\n            color=\"#FFCC33\"\r\n            style=\"transform: scale(0.7); margin-right: 30rpx\"\r\n            class=\"radio\"\r\n            >选中\r\n          </radio>\r\n          <radio\r\n            value=\"r2\"\r\n            color=\"#FFCC33\"\r\n            style=\"transform: scale(0.7)\"\r\n            class=\"radio\"\r\n            >未选中</radio\r\n          >\r\n        </radio-group>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 推荐展示样式 </text>\r\n        </view>\r\n      </view>\r\n      <view class=\"uni-list uni-common-pl\">\r\n        <radio-group @change=\"radioChange\" class=\"radio-group\">\r\n          <radio\r\n            class=\"uni-list-cell uni-list-cell-pd radio\"\r\n            v-for=\"(item, index) in items\"\r\n            :key=\"item.value\"\r\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\"\r\n            :value=\"item.value\"\r\n            :checked=\"index === current\"\r\n          >\r\n            {{ item.name }}\r\n          </radio>\r\n        </radio-group>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.uni-list-cell {\r\n  justify-content: flex-start;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| radio | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| checked | 5.0 | √ | √ | 10.0 | √ | x |\n| color | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| borderColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBackgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBorderColor | 5.0 | x | √ | 10.0 | x | x |\n| iconColor | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/radio)\n"},"radio-group":{"name":"## radio-group","description":"单选组，内部由多个 radio 组成","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| @change | (event: [RadioGroupChangeEvent](#radiogroupchangeevent)) => void | - | radio-group 中的选中项发生变化时触发 change 事件，event.detail = {value: 选中项radio的value} |","event":"\n### 事件\n#### RadioGroupChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### RadioGroupChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| radio-group | 5.0 | √ | √ | 10.0 | √ | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [radio](#radio)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/radio)\n"},"rich-text":{"name":"## rich-text","description":"富文本。可渲染文字样式、图片、超链接。支持部分HTML标签","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| nodes | Array \\| String | - | 节点列表 \\| HTML String |\n| selectable | Boolean | false | 文本是否可选 |\n| @itemclick | (event: [RichTextItemClickEvent](#richtextitemclickevent)) => void | - | 拦截点击事件（只支持 a、img标签），返回用户自定义数据或img标签的src属性或a标签的href属性。event.detail={ ref \\| src \\| href } |","event":"\n### 事件\n#### RichTextItemClickEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RichTextItemClickEventdetail](#richtextitemclickeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RichTextItemClickEventdetail 属性值 @richtextitemclickeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| ref | string | 否 | - |  自定义数据 |\n| src | string | 否 | - |  \\<img/>图片链接 |\n| href | string | 否 | - |  \\<a/>超链接 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/rich-text/rich-text.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"rich-text\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-btn-v\">\n        <navigator url=\"/pages/component/rich-text/rich-text-tags\">\n          <button type=\"primary\">rich-text渲染单个HTML标签示例</button>\n        </navigator>\n      </view>\n      <view class=\"uni-btn-v\">\n        <navigator url=\"/pages/component/rich-text/rich-text-complex\">\n          <button type=\"primary\">rich-text渲染复杂HTML示例</button>\n        </navigator>\n      </view>\n      <view class=\"uni-title\">\n        <text class=\"uni-subtitle-text\">selectable</text>\n      </view>\n      <view class=\"text-box\">\n        <rich-text :selectable=\"true\"\n          nodes=\"<span>hello uni-app x!</span><br/><span>uni-app x，终极跨平台方案</span>\"></rich-text>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n\n</script>\n\n<style>\n  .text-box {\n    padding: 40rpx 0;\n    background-color: white;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| rich-text | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| selectable | 5.0 | x | 3.91 | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/rich-text)\n"},"scroll-view":{"name":"## scroll-view","description":"可滚动视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| scroll-x | Boolean | false | 允许横向滚动，不支持同时设置scroll-y属性为true，同时设置true时scroll-y生效 |\n| scroll-y | Boolean | true | 允许纵向滚动，不支持同时设置scroll-x属性为true，同时设置true时scroll-y生效 |\n| rebound | Boolean | true | 控制是否回弹效果 |\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 | - | 值应为某子元素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| refresher-background | String | #FFF | 设置下拉刷新区域背景颜色 |\n| refresher-triggered | Boolean | false | 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 |\n| show-scrollbar | Boolean | true | 控制是否出现滚动条 |\n| custom-nested-scroll | Boolean | false | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| @refresherpulling | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被触发 |\n| @refresherrestore | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被复位 |\n| @refresherabort | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被中止 |\n| @scrolltoupper | (event: [ScrollToUpperEvent](#scrolltoupperevent)) => void | - | 滚动到顶部/左边，会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [ScrollToLowerEvent](#scrolltolowerevent)) => void | - | 滚动到底部/右边，会触发 scrolltolower 事件 |\n| @scroll | (event: [ScrollEvent](#scrollevent)) => void | - | 滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| @startnestedscroll | (event: [StartNestedScrollEvent](#startnestedscrollevent)) => Boolean | - | 子元素开始滚动时触发, return ture表示与子元素开启滚动协商 默认return false! event = {node} |\n| @nestedprescroll | (event: [NestedPreScrollEvent](#nestedprescrollevent)) => void | - | 子元素滚动时触发，可执行event.consumed(x,y)告知子元素deltaX、deltaY各消耗多少。子元素将执行差值后的deltaX、deltaY滚动距离。不执行consumed(x,y)则表示父元素不消耗deltaX、deltaY。event = {deltaX, deltaY} |\n| @stopnestedscroll | (event: [Event](/uni-app-x/component/common#event)) => void | - | 子元素滚动结束或意外终止时触发 |","event":"\n### 事件\n#### RefresherEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RefresherEventdetail](#refreshereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RefresherEventdetail 属性值 @refreshereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToUpperEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToUpperEventdetail](#scrolltouppereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToUpperEventdetail 属性值 @scrolltouppereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 top 或 left |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToLowerEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToLowerEventdetail](#scrolltolowereventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToLowerEventdetail 属性值 @scrolltolowereventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 bottom 或 right |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollEventdetail](#scrolleventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollEventdetail 属性值 @scrolleventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 是 | - |  竖向滚动的距离 |\n| scrollLeft | number | 是 | - |  横向滚动的距离 |\n| scrollHeight | number | 是 | - |  滚动区域的高度 |\n| scrollWidth | number | 是 | - |  滚动区域的宽度 |\n| deltaY | number | 是 | - |  当次滚动事件竖向滚动量 |\n| deltaX | number | 是 | - |  当次滚动事件横向滚动量 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### StartNestedScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| node | [Element](/uni-app-x/dom/element.md) | 是 | - |  开始滚动子节点对象 |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### NestedPreScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| deltaX | number | 是 | - |  x轴滚动距离 |\n| deltaY | number | 是 | - |  y轴滚动距离 |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| consumed | (consumedX: number, consumedY: number) => void | 是 | - |  通知到子节点x,y轴滚动距离的消耗 |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/scroll-view/scroll-view.uvue) \n ```html\n<template>\n\t<!-- #ifdef APP -->\n\t<scroll-view style=\"flex: 1\">\n\t\t<!-- #endif -->\n\t\t<view>\n\t\t\t<page-head title=\"scroll-view,区域滚动视图\"></page-head>\n\t\t\t<view class=\"uni-padding-wrap uni-common-mt\">\n\t\t\t\t<view class=\"uni-title uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-title-text\">Vertical Scroll</text>\n\t\t\t\t\t<text class=\"uni-subtitle-text\">纵向滚动</text>\n\t\t\t\t</view>\n\t\t\t\t<view>\n\t\t\t\t\t<scroll-view :scroll-top=\"scrollTop\" :scroll-y=\"true\" class=\"scroll-Y\" scroll-with-animation=\"true\"\n\t\t\t\t\t\t@scrolltoupper=\"upper\" @scrolltolower=\"lower\" @scroll=\"scroll\">\n\t\t\t\t\t\t<view id=\"demo1\" class=\"scroll-view-item uni-bg-red\"><text class=\"text\">A</text></view>\n\t\t\t\t\t\t<view id=\"demo2\" class=\"scroll-view-item uni-bg-green\"><text class=\"text\">B</text></view>\n\t\t\t\t\t\t<view id=\"demo3\" class=\"scroll-view-item uni-bg-blue\"><text class=\"text\">C</text></view>\n\t\t\t\t\t</scroll-view>\n\t\t\t\t</view>\n\t\t\t\t<view @tap=\"goTop\" class=\"uni-center uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-link\">点击这里返回顶部</text>\n\t\t\t\t</view>\n\n\t\t\t\t<view class=\"uni-title uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-title-text\">Horizontal Scroll</text>\n\t\t\t\t\t<text class=\"uni-subtitle-text\">横向滚动</text>\n\t\t\t\t</view>\n\t\t\t\t<view>\n\t\t\t\t\t<scroll-view class=\"scroll-view_H\" :scroll-x=\"true\" @scroll=\"scroll\" :scroll-left=\"120\">\n\t\t\t\t\t\t<view id=\"demo1\" class=\"scroll-view-item_H uni-bg-red\"><text class=\"text\">A</text></view>\n\t\t\t\t\t\t<view id=\"demo2\" class=\"scroll-view-item_H uni-bg-green\"><text class=\"text\">B</text></view>\n\t\t\t\t\t\t<view id=\"demo3\" class=\"scroll-view-item_H uni-bg-blue\"><text class=\"text\">C</text></view>\n\t\t\t\t\t</scroll-view>\n\t\t\t\t</view>\n\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t非下拉刷新的属性示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-refresher-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t下拉刷新的属性示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-refresher\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\"> 默认下拉刷新示例 </button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-custom-refresher-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t自定义下拉刷新示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t</view>\n\t\t</view>\n\t\t<!-- #ifdef APP -->\n\t</scroll-view>\n\t<!-- #endif -->\n</template>\n<script lang=\"uts\">\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tscrollTop: 0,\n\t\t\t\toldScrollTop: 0,\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tupper: function (e : ScrollToUpperEvent) {\n\t\t\t\tconsole.log(e)\n\t\t\t},\n\t\t\tlower: function (e : ScrollToLowerEvent) {\n\t\t\t\tconsole.log(e)\n\t\t\t},\n\t\t\tscroll: function (e : ScrollEvent) {\n\t\t\t\tthis.oldScrollTop = e.detail.scrollTop\n\t\t\t},\n\t\t\tgoTop: function () {\n\t\t\t\t// 解决view层不同步的问题\n\t\t\t\tthis.scrollTop = this.oldScrollTop\n\t\t\t\tthis.$nextTick(function () {\n\t\t\t\t\tthis.scrollTop = 0\n\t\t\t\t})\n\t\t\t\tuni.showToast({\n\t\t\t\t\ticon: 'none',\n\t\t\t\t\ttitle: '纵向滚动 scrollTop 值已被修改为 0',\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t}\n</script>\n\n<style>\n\t.scroll-Y {\n\t\theight: 300rpx;\n\t}\n\n\t.scroll-view_H {\n\t\twidth: 100%;\n\t\tflex-direction: row;\n\t}\n\n\t.scroll-view-item {\n\t\theight: 300rpx;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.scroll-view-item_H {\n\t\twidth: 690rpx;\n\t\theight: 300rpx;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.text {\n\t\tfont-size: 36rpx;\n\t\tcolor: #ffffff;\n\t}\n\n\t.button {\n\t\tmargin-top: 30rpx;\n\t}\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| scroll-view | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| scroll-x | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-y | 5.0 | √ | 3.9+ | - | - | - |\n| rebound | 5.0 | x | 3.9+ | - | - | - |\n| upper-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| lower-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-top | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-left | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-into-view | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-with-animation | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-enabled | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-max-drag-distance | 5.0 | x | 3.9+ | - | - | - |\n| refresher-default-style | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-background | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-triggered | 5.0 | √ | 3.9+ | - | - | - |\n| show-scrollbar | 5.0 | √ | 3.9+ | - | - | - |\n| custom-nested-scroll | 5.0 | x | 3.9+ | 9.0 | √ | - |\n| @refresherpulling | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherrefresh | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherrestore | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherabort | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scrolltoupper | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scrolltolower | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scroll | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @startnestedscroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @nestedprescroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @stopnestedscroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/scroll-view)\n"},"slider":{"name":"## slider","description":"滑动选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\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| color | ColorString | - | slider 背景条的颜色（请使用 backgroundColor） |\n| activeColor | ColorString | #007aff | slider 滑块左侧已选择部分的线条颜色 |\n| backgroundColor | ColorString | #e9e9e9 | radio背景条的颜色 |\n| block-size | Number | 28 | radio滑块的大小，取值范围为 12 - 28 |\n| block-color | ColorString | #ffffff | 滑块颜色 |\n| show-value | Boolean | false | 是否显示当前 value |\n| @change | (event: [SliderChangeEvent](#sliderchangeevent)) => void | - | 完成一次拖动后触发的事件，event.detail = {value: value} |\n| @changing | (event: [SliderChangeEvent](#sliderchangeevent)) => void | - | 拖动过程中触发的事件，event.detail = {value: value} |","event":"\n### 事件\n#### SliderChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SliderChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/slider/slider.uvue) \n ```html\n<script>\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      };\n    },\n    methods: {\n      sliderChange(e : SliderChangeEvent) {\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    },\n  };\n</script>\n\n<template>\n  <view class=\"main\">\n    <slider :disabled=\"disabled_boolean\" :min=\"min_input\" :max=\"max_input\" :step=\"step_input\" :value=\"value_input\"\n      :activeColor=\"activeColor_input\" :backgroundColor=\"backgroundColor_input\" :block-size=\"block_size_input\"\n      :block-color=\"block_color_input\" :show-value=\"show_value_boolean\" @click=\"slider_click\"\n      @touchstart=\"slider_touchstart\" @touchmove=\"slider_touchmove\" @touchcancel=\"slider_touchcancel\"\n      @touchend=\"slider_touchend\" @tap=\"slider_tap\" @longpress=\"slider_longpress\" @change=\"slider_change\"\n      @changing=\"slider_changing\" style=\"width: 90%\"><text>uni-app-x</text></slider>\n  </view>\n\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n  <!-- #endif -->\n    <view class=\"content nvue\">\n      <page-head title=\"组件属性\"></page-head>\n      <boolean-data :defaultValue=\"false\" title=\"是否显示当前 value\" @change=\"change_show_value_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否禁用\" @change=\"change_disabled_boolean\"></boolean-data>\n      <input-data defaultValue=\"0\" title=\"slider 最小值\" type=\"number\" @confirm=\"confirm_min_input\"></input-data>\n      <input-data defaultValue=\"100\" title=\"slider 最大值\" type=\"number\" @confirm=\"confirm_max_input\"></input-data>\n      <input-data defaultValue=\"1\" title=\"slider 步长，取值必须大于 0，并且可被(max - min)整除\" type=\"number\"\n        @confirm=\"confirm_step_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"radio当前取值\" type=\"number\" @confirm=\"confirm_value_input\"></input-data>\n      <input-data defaultValue=\"#007aff\" title=\"slider 滑块左侧已选择部分的线条颜色\" type=\"text\"\n        @confirm=\"confirm_activeColor_input\"></input-data>\n      <input-data defaultValue=\"#e9e9e9\" title=\"radio背景条的颜色\" type=\"text\"\n        @confirm=\"confirm_backgroundColor_input\"></input-data>\n      <input-data defaultValue=\"28\" title=\"radio滑块的大小，取值范围为 12 - 28\" type=\"number\"\n        @confirm=\"confirm_block_size_input\"></input-data>\n      <input-data defaultValue=\"#ffffff\" title=\"滑块颜色\" type=\"text\" @confirm=\"confirm_block_color_input\"></input-data>\n    </view>\n\n    <view class=\"uni-padding-wrap\">\n      <page-head title=\"默认及使用\"></page-head>\n      <view class=\"uni-title\">显示当前value</view>\n      <view>\n        <slider @change=\"sliderChange\" :value=\"50\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">设置步进:step=10跳动</view>\n      <view>\n        <view class=\"uni-row\">\n          <text>0</text>\n          <text class=\"m-l-a\">100</text>\n        </view>\n        <slider @change=\"sliderChange\" :value=\"60\" :step=\"10\" />\n      </view>\n\n      <view class=\"uni-title\">浮点步进:step=0.01跳动</view>\n      <view>\n        <slider :value=\"0.5\" :min=\"0\" :max=\"1\" :step=\"0.01\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">设置最小/最大值</view>\n      <view>\n        <slider @change=\"sliderChange\" :value=\"100\" :min=\"50\" :max=\"200\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">不同颜色和大小的滑块</view>\n      <view>\n        <slider class=\"slider-custom-color-and-size\" @change=\"sliderChange\" :value=\"sliderValue\"\n          :backgroundColor=\"sliderBackgroundColor\" :activeColor=\"sliderActiveColor\" :blockColor=\"sliderBlockColor\"\n          :block-size=\"sliderBlockSize\" />\n      </view>\n    </view>\n  <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<style>\n  .main {\n    max-height: 500rpx;\n    padding: 10rpx 0;\n    border-bottom: 1px solid rgba(0, 0, 0, 0.06);\n    flex-direction: row;\n    justify-content: center;\n  }\n\n  .main .list-item {\n    width: 100%;\n    height: 200rpx;\n    border: 1px solid #666;\n  }\n\n  .m-l-a {\n    margin-left: auto;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| slider | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| disabled | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| min | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| max | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| step | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| value | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| activeColor | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| backgroundColor | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| block-size | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| block-color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| show-value | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @changing | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/slider)\n"},"swiper-item":{"name":"## swiper-item","description":"swiper的唯一合法子组件。每个swiper-item代表一个滑块。宽高自动设置为100%","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| item-id | String | - | 该 swiper-item 的标识符 |","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| swiper-item | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| item-id | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.net.cn/component/swiper.html#swiper-item)\n"},"swiper":{"name":"## swiper","description":"滑块视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| indicator-dots | Boolean | false | 是否显示面板指示点 |\n| indicator-color | ColorString | rgba(0, 0, 0, .3) | 指示点颜色 |\n| indicator-active-color | ColorString | #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| circular | Boolean | false | 是否采用衔接滑动 |\n| vertical | Boolean | false | 滑动方向是否为纵向 |\n| @change | (event: [SwiperChangeEvent](#swiperchangeevent)) => void | - | current 改变时会触发 change 事件，event.detail = {current: current, source: source} |\n| @transition | (event: [SwiperTransitionEvent](#swipertransitionevent)) => void | - | swiper-item 的位置发生改变时会触发 transition 事件，event.detail = {dx: dx, dy: dy} |\n| @animationfinish | (event: [SwiperAnimationFinishEvent](#swiperanimationfinishevent)) => void | - | 动画结束时会触发 animationfinish 事件，event.detail = {current: current, source: source} |","event":"\n### 事件\n#### SwiperChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperChangeEventdetail](#swiperchangeeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperChangeEventdetail 属性值 @swiperchangeeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| current | number | 是 | - | - |\n| source | string | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwiperTransitionEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperTransitionEventdetail](#swipertransitioneventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperTransitionEventdetail 属性值 @swipertransitioneventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dx | number | 是 | - | - |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwiperAnimationFinishEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperAnimationFinishEventdetail](#swiperanimationfinisheventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperAnimationFinishEventdetail 属性值 @swiperanimationfinisheventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| current | number | 是 | - | - |\n| source | string | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/swiper/swiper.uvue) \n ```html\n<template>\r\n\t<!-- #ifdef APP -->\r\n\t<scroll-view style=\"flex: 1\">\r\n\t\t<!-- #endif -->\r\n\t\t<view>\r\n\t\t\t<page-head title=\"swiper,可滑动视图\"></page-head>\r\n\t\t\t<view class=\"uni-margin-wrap\">\r\n\t\t\t\t<swiper class=\"swiper\" :vertical=\"verticalSelect\" :indicator-dots=\"dotsSelect\" :autoplay=\"autoplaySelect\"\n          :rebound=\"reboundSelect\"\r\n\t\t\t\t\t:interval=\"intervalSelect\" :circular=\"circularSelect\" :indicator-color=\"indicatorColor\"\r\n\t\t\t\t\t:indicator-active-color=\"indicatorColorActive\" :disable-touch=\"disableTouchSelect\" :current=\"currentVal\"\r\n\t\t\t\t\t:current-item-id=\"currentItemIdVal\" @change=\"swiperChange\" @transition=\"swiperTransition\"\r\n\t\t\t\t\t@animationfinish=\"swiperAnimationfinish\">\r\n\t\t\t\t\t<swiper-item item-id=\"A\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-red\"><text class=\"swiper-item-Text\">A</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t\t<swiper-item item-id=\"B\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-green\"><text class=\"swiper-item-Text\">B</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t\t<swiper-item item-id=\"C\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-blue\"><text class=\"swiper-item-Text\">C</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t</swiper>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示面板指示点</view>\r\n\t\t\t\t\t<switch :checked=\"dotsSelect\" @change=\"dotsChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否自动切换</view>\r\n\t\t\t\t\t<switch :checked=\"autoplaySelect\" @change=\"autoplayChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否循环</view>\r\n\t\t\t\t\t<switch :checked=\"circularSelect\" @change=\"circularChange\" />\r\n\t\t\t\t</view>\n        <view class=\"uni-list-cell uni-list-cell-pd\">\n        \t<view class=\"uni-list-cell-db\">是否显示rebound效果</view>\n        \t<switch :checked=\"reboundSelect\" @change=\"reboundSelectChange\" />\n        </view>\r\n\t\t\t\t<view class=\"uni-title\">间隔时间(毫秒)</view>\r\n\t\t\t\t<view>\r\n\t\t\t\t\t<slider @change=\"sliderChange\" :value=\"1000\" :min=\"500\" :max=\"5000\" :show-value=\"true\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制指示器颜色</view>\r\n\t\t\t\t\t<switch :checked=\"indicatorColorSelect\" @change=\"indicatorColorChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">纵向</view>\r\n\t\t\t\t\t<switch :checked=\"verticalSelect\" @change=\"verticalChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">指定current为最后一个元素</view>\r\n\t\t\t\t\t<switch :checked=\"currentSelect\" @change=\"currentChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">指定current-item-id为最后一个元素</view>\r\n\t\t\t\t\t<switch :checked=\"currentItemIdSelect\" @change=\"currentItemIdChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">禁止用户 touch 操作</view>\r\n\t\t\t\t\t<switch :checked=\"disableTouchSelect\" @change=\"disableTouchChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperTransition 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperTransitionSelect\" @change=\"swiperTransitionChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperAnimationfinish 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperAnimationfinishSelect\" @change=\"swiperAnimationfinishChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperChange 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperChangeSelect\" @change=\"swiperChangeChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t\t<!-- #ifdef APP -->\r\n\t</scroll-view>\r\n\t<!-- #endif -->\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\tbackground: ['color1', 'color2', 'color3'],\r\n\t\t\t\tdotsSelect: false,\n        reboundSelect:false,\r\n\t\t\t\tautoplaySelect: false,\r\n\t\t\t\tcircularSelect: false,\r\n\t\t\t\tindicatorColorSelect: false,\r\n\t\t\t\tverticalSelect: false,\r\n\t\t\t\tcurrentSelect: false,\r\n\t\t\t\tcurrentItemIdSelect: false,\r\n\t\t\t\tintervalSelect: 2000,\r\n\t\t\t\tindicatorColor: \"\",\r\n\t\t\t\tindicatorColorActive: \"\",\r\n\t\t\t\tcurrentVal: 0,\r\n\t\t\t\tcurrentItemIdVal: \"\",\r\n\t\t\t\tdisableTouchSelect: false,\r\n\t\t\t\tswiperTransitionSelect: false,\r\n\t\t\t\tswiperAnimationfinishSelect: false,\r\n\t\t\t\tswiperChangeSelect: false,\n        currentValChange:0\r\n\t\t\t}\r\n\t\t},\n\t\tmethods: {\r\n\r\n\t\t\tswiperChange: function (e : SwiperChangeEvent) {\n        this.currentValChange = e.detail.current\n        console.log(this.currentValChange)\n\t\t\t\tif (this.swiperChangeSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperChange\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tswiperTransition: function (e : SwiperTransitionEvent) {\r\n\t\t\t\tif (this.swiperTransitionSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperTransition\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tswiperAnimationfinish: function (e : SwiperAnimationFinishEvent) {\r\n\t\t\t\tif (this.swiperAnimationfinishSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperAnimationfinish\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\r\n\t\t\tdotsChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.dotsSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperTransitionChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperTransitionSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperChangeChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperChangeSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperAnimationfinishChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperAnimationfinishSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tautoplayChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.autoplaySelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tverticalChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.verticalSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tdisableTouchChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.disableTouchSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tcurrentItemIdChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.currentItemIdSelect = e.detail.value\r\n\t\t\t\tif (this.currentItemIdSelect) {\r\n\t\t\t\t\tthis.currentItemIdVal = 'C'\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.currentItemIdVal = 'A'\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tcurrentChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.currentSelect = e.detail.value\r\n\t\t\t\tif (this.currentSelect) {\r\n\t\t\t\t\tthis.currentVal = 2\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.currentVal = 0\r\n\t\t\t\t}\r\n\r\n\t\t\t},\r\n\t\t\tcircularChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.circularSelect = e.detail.value\r\n\t\t\t\tconsole.log(this.circularSelect)\r\n\t\t\t},\n      reboundSelectChange: function (e : SwitchChangeEvent) {\n      \tthis.reboundSelect = e.detail.value\n      \tconsole.log(this.reboundSelect)\n      },\r\n\t\t\tsliderChange(e : SliderChangeEvent) {\r\n\t\t\t\tthis.intervalSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tindicatorColorChange(e : SwitchChangeEvent) {\r\n\t\t\t\tthis.indicatorColorSelect = e.detail.value\r\n\t\t\t\tif (this.indicatorColorSelect) {\r\n\t\t\t\t\t// 选择了定制指示器颜色\r\n\t\t\t\t\tthis.indicatorColor = \"#ff00ff\"\r\n\t\t\t\t\tthis.indicatorColorActive = \"#0000ff\"\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// 没有选择颜色\r\n\t\t\t\t\tthis.indicatorColor = \"\"\r\n\t\t\t\t\tthis.indicatorColorActive = \"\"\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-margin-wrap {\r\n\t\twidth: 690rpx;\r\n\t\twidth: 100%;\r\n\t\t;\r\n\t}\r\n\r\n\t.swiper {\r\n\t\theight: 300rpx;\r\n\t}\r\n\r\n\t.swiper-item {\r\n\t\twidth: 100%;\r\n\t\theight: 300rpx;\r\n\t}\r\n\r\n\t.swiper-item-Text {\r\n\t\twidth: 100%;\r\n\t\ttext-align: center;\r\n\t\tline-height: 300rpx;\r\n\t}\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| swiper | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| indicator-dots | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| indicator-color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| indicator-active-color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| disable-touch | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| autoplay | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| current | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| current-item-id | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| interval | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| circular | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| vertical | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @transition | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @animationfinish | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [swiper-item](#swiper-item)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/swiper)\n"},"switch":{"name":"## switch","description":"开关选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| checked | Boolean | - | 是否选中 |\n| color | ColorString | - | switch 的颜色，同 css 的 color |\n| disabled | Boolean | - | 是否禁用 |\n| @change | (event: [SwitchChangeEvent](#switchchangeevent)) => void | - | checked 改变时触发 change 事件，event.detail={ value:checked} |","event":"\n### 事件\n#### SwitchChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwitchChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/switch/switch.uvue) \n ```html\n<template>\n  <view class=\"uni-padding-wrap\">\n    <view class=\"uni-common-mt\">\n      <view class=\"uni-title\">默认样式</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-checked\" :checked=\"checked\" @change=\"switch1Change\" />\n        <switch @change=\"switch2Change\" />\n        <!-- <text class=\"switch-checked-value\">{{clickCheckedValue}}</text> -->\n      </view>\n      <view class=\"uni-title\">禁用样式</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-checked\" :checked=\"checked\" :disabled=\"true\" />\n        <switch :disabled=\"true\" />\n      </view>\n      <view class=\"uni-title\">不同颜色和尺寸的switch</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-color-checked\" :color=\"color\" style=\"transform:scale(0.7)\" :checked=\"true\" />\n        <switch class=\"switch-color\" :color=\"color\" style=\"transform:scale(0.7)\" />\n      </view>\n      <view class=\"uni-title\">推荐展示样式</view>\n    </view>\n    <view class=\"uni-list\">\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">开启中</view>\n        <switch :checked=\"true\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">关闭</view>\n        <switch />\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\n  export default {\n    data() {\n      return {\n        title: 'switch 开关',\n        checked: true,\n        color: '#FFCC33',\n        clickCheckedValue: true\n      }\n    },\n    methods: {\n      switch1Change: function (e : SwitchChangeEvent) {\n        this.clickCheckedValue = e.detail.value\n        console.log('switch1 发生 change 事件，携带值为', e.detail.value)\n      },\n      switch2Change: function (e : SwitchChangeEvent) {\n        console.log('switch2 发生 change 事件，携带值为', e.detail.value)\n      }\n    }\n  }\n</script>\n\n<style>\n  .flex-row {\n    flex-direction: row;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| switch | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| checked | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| disabled | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/switch)\n"},"text":{"name":"## text","description":"文本","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| selectable | Boolean | false | 文本是否可选 |\n| space | String | - | 显示连续空格 [space](#space-values) |\n| decode | Boolean | false | 是否解码 |\n\n#### space @space-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| ensp | 中文字符空格一半大小 |\n| emsp | 中文字符空格大小 |\n| nbsp | 根据字体设置的空格大小 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/text/text.uvue) \n ```html\n<template>\r\n  <view>\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-padding-wrap uni-common-mt\">\r\n      <view class=\"text-box\" scroll-y=\"true\">\r\n        <text class=\"text\">{{ text }}</text>\r\n      </view>\r\n      <view class=\"uni-btn-v\">\r\n        <button class=\"uni-btn\" type=\"primary\" :disabled=\"!canAdd\" @click=\"add\">\r\n          add line\r\n        </button>\r\n        <button\r\n          class=\"uni-btn\"\r\n          type=\"warn\"\r\n          :disabled=\"!canRemove\"\r\n          @click=\"remove\"\r\n        >\r\n          remove line\r\n        </button>\r\n        <button class=\"uni-btn\" type=\"primary\" @click=\"textProps\">\r\n          更多属性示例\r\n        </button>\r\n      </view>\r\n    </view>\r\n  </view>\r\n</template>\r\n<script lang=\"uts\">\r\nexport 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</script>\r\n\r\n<style>\r\n.text-box {\r\n  margin-bottom: 40rpx;\r\n  padding: 40rpx 0;\r\n  display: flex;\r\n  min-height: 300rpx;\r\n  background-color: #ffffff;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n.text {\r\n  font-size: 30rpx;\r\n  color: #353535;\r\n  line-height: 54rpx;\r\n  text-align: center;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| text | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n - [text](#text)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/text)\n"},"textarea":{"name":"## textarea","description":"多行输入框","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| value | String |  | 输入框的初始内容 |\n| placeholder | String |  | 输入框为空时占位符 |\n| placeholder-style | String |  | 指定 placeholder 的样式 |\n| placeholder-class | String |  | 指定 placeholder 的样式类 |\n| maxlength | Number | 140 | 最大输入长度，设置为 -1 的时候不限制最大长度 |\n| auto-focus | Boolean | false | 自动获取焦点 |\n| focus | Boolean | false | 获取焦点 |\n| cursor | Number | 0 | 指定focus时的光标位置 |\n| confirm-type | String | done | 设置键盘右下角按钮的文字 [confirm-type](#confirm-type-values) |\n| confirm-hold | Boolean | false | 点击键盘右下角按钮时是否保持键盘不收起 |\n| auto-height | Boolean | false | 是否自动增高，设置auto-height时，style.height不生效 |\n| cursor-spacing | Number | 0 | 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| selection-start | Number | -1 | 光标起始位置，自动聚集时有效，需与selection-end搭配使用 |\n| selection-end | Number | -1 | 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 |\n| adjust-position | Boolean | true | 键盘弹起时，是否自动上推页面 |\n| @confirm | (event: [InputConfirmEvent](#inputconfirmevent)) => void | - | 点击完成时， 触发 confirm 事件，event.detail = {value: value} |\n| @input | (event: [InputEvent](#inputevent)) => void | - | 当键盘输入时，触发 input 事件，event.detail = {value, cursor}， @input 处理函数的返回值并不会反映到 textarea 上 |\n| @linechange | (event: [TextareaLineChangeEvent](#textarealinechangeevent)) => void | - | 输入框行数变化时调用，event.detail = {height: 0, heightRpx: 0, lineCount: 0} |\n| @blur | (event: [TextareaBlurEvent](#textareablurevent)) => void | - | 输入框失去焦点时触发，event.detail = {value, cursor} |\n| @keyboardheightchange | (event: [InputKeyboardHeightChangeEvent](#inputkeyboardheightchangeevent)) => void | - | 键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration} |\n| @focus | (event: [TextareaFocusEvent](#textareafocusevent)) => void | - | 输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持 |\n\n#### confirm-type @confirm-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| send | 发送 |\n| search | 搜索 |\n| next | 下一个 |\n| go | 前往 |\n| done | 完成 |\n\n","event":"\n### 事件\n#### InputConfirmEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputConfirmEventdetail](#inputconfirmeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputConfirmEventdetail 属性值 @inputconfirmeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputEventdetail](#inputeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputEventdetail 属性值 @inputeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  光标的位置 |\n| keyCode | number | 是 | - |  输入字符的Unicode值 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaLineChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaLineChangeEventdetail](#textarealinechangeeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaLineChangeEventdetail 属性值 @textarealinechangeeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| lineCount | number | 是 | - |  行数 |\n| heightRpx | number | 是 | - |  textarea的高度 |\n| height | number | 是 | - |  textarea的高度 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaBlurEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaBlurEventdetail](#textareablureventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaBlurEventdetail 属性值 @textareablureventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  选择区域的起始位置 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputKeyboardHeightChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputKeyboardHeightChangeEventdetail](#inputkeyboardheightchangeeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputKeyboardHeightChangeEventdetail 属性值 @inputkeyboardheightchangeeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| duration | number | 是 | - |  持续时间 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaFocusEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaFocusEventdetail](#textareafocuseventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaFocusEventdetail 属性值 @textareafocuseventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/textarea/textarea.uvue) \n ```html\n<script>\r\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\tadjust_position_boolean: false,\r\n\t\t\tshow_confirm_bar_boolean: false,\r\n\t\t\tfixed_boolean: false,\r\n\t\t\tauto_height_boolean: false,\r\n\t\t\tconfirm_hold_boolean: false,\r\n\t\t\tfocus_boolean: false,\r\n\t\t\tauto_focus_boolean: false,\n      default_value:\"\",\n      maxlength:-1,\r\n\t\t\tconfirm_type_enum: [{\"value\":0,\"name\":\"send\"},{\"value\":1,\"name\":\"search\"},{\"value\":2,\"name\":\"next\"},{\"value\":3,\"name\":\"go\"},{\"value\":4,\"name\":\"done\"}] as ItemType[],\r\n\t\t\tconfirm_type_enum_current: 0,\r\n\t\t\tinputmode_enum: [{\"value\":0,\"name\":\"none\"},{\"value\":1,\"name\":\"text\"},{\"value\":2,\"name\":\"decimal\"},{\"value\":3,\"name\":\"numeric\"},{\"value\":4,\"name\":\"tel\"},{\"value\":5,\"name\":\"search\"},{\"value\":6,\"name\":\"email\"},{\"value\":7,\"name\":\"url\"}] as ItemType[],\r\n\t\t\tinputmode_enum_current: 0\r\n\t\t}\r\n\t},\n\r\n\tmethods: {\r\n\t\ttextarea_click() { console.log(\"组件被点击时触发\") },\r\n\t\ttextarea_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\ttextarea_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\ttextarea_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\ttextarea_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\ttextarea_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\ttextarea_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\ttextarea_confirm() { console.log(\"点击完成时， 触发 confirm 事件，event.detail = {value: value}\") },\r\n\t\ttextarea_input() { console.log(\"当键盘输入时，触发 input 事件，event.detail = {value, cursor}， @input 处理函数的返回值并不会反映到 textarea 上\") },\r\n\t\ttextarea_linechange() { console.log(\"输入框行数变化时调用，event.detail = {height: 0, heightRpx: 0, lineCount: 0}\") },\r\n\t\ttextarea_blur() { console.log(\"输入框失去焦点时触发，event.detail = {value, cursor}\") },\r\n\t\ttextarea_keyboardheightchange() { console.log(\"键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration}\") },\r\n\t\ttextarea_focus() { console.log(\"输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持\") },\r\n\t\tchange_adjust_position_boolean(checked : boolean) { this.adjust_position_boolean = checked },\r\n\t\tchange_show_confirm_bar_boolean(checked : boolean) { this.show_confirm_bar_boolean = checked },\r\n\t\tchange_fixed_boolean(checked : boolean) { this.fixed_boolean = checked },\r\n\t\tchange_auto_height_boolean(checked : boolean) { this.auto_height_boolean = checked },\r\n\t\tchange_confirm_hold_boolean(checked : boolean) { this.confirm_hold_boolean = checked },\r\n\t\tchange_focus_boolean(checked : boolean) { this.focus_boolean = checked },\r\n\t\tchange_auto_focus_boolean(checked : boolean) { this.auto_focus_boolean = checked },\r\n\t\tradio_change_confirm_type_enum(checked : number) { this.confirm_type_enum_current = checked },\r\n\t\tradio_change_inputmode_enum(checked : number) { this.inputmode_enum_current = checked }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <textarea\n    :value=\"default_value\"\r\n      class=\"uni-textarea\"\r\n      :auto-focus=\"auto_focus_boolean\"\r\n      :focus=\"focus_boolean\"\r\n      :confirm-type=\"confirm_type_enum[confirm_type_enum_current].name\"\r\n      :confirm-hold=\"confirm_hold_boolean\"\r\n      :auto-height=\"auto_height_boolean\"\r\n      :fixed=\"fixed_boolean\"\r\n      :show-confirm-bar=\"show_confirm_bar_boolean\"\r\n      :adjust-position=\"adjust_position_boolean\"\r\n      :inputmode=\"inputmode_enum[inputmode_enum_current].name\"\n      :maxlength=\"maxlength\"\r\n      @click=\"textarea_click\"\r\n      @touchstart=\"textarea_touchstart\"\r\n      @touchmove=\"textarea_touchmove\"\r\n      @touchcancel=\"textarea_touchcancel\"\r\n      @touchend=\"textarea_touchend\"\r\n      @tap=\"textarea_tap\"\r\n      @longpress=\"textarea_longpress\"\r\n      @confirm=\"textarea_confirm\"\r\n      @input=\"textarea_input\"\r\n      @linechange=\"textarea_linechange\"\r\n      @blur=\"textarea_blur\"\r\n      @keyboardheightchange=\"textarea_keyboardheightchange\"\r\n      @focus=\"textarea_focus\"\r\n      style=\"padding: 20rpx; border: 1px solid #666\"\r\n    />\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"键盘弹起时，是否自动上推页面\"\r\n        @change=\"change_adjust_position_boolean\"\r\n      ></boolean-data>\n      <!-- #ifdef !APP -->\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否显示键盘上方带有”完成“按钮那一栏\"\r\n        @change=\"change_show_confirm_bar_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true\"\r\n        @change=\"change_fixed_boolean\"\r\n      ></boolean-data>\n      <!-- #endif -->\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否自动增高，设置auto-height时，style.height不生效\"\r\n        @change=\"change_auto_height_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"点击键盘右下角按钮时是否保持键盘不收起\"\r\n        @change=\"change_confirm_hold_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"focus_boolean\"\r\n        title=\"获取焦点\"\r\n        @change=\"change_focus_boolean\" class=\"textarea-focus\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"自动获取焦点\"\r\n        @change=\"change_auto_focus_boolean\"\r\n      ></boolean-data>\r\n      <enum-data class=\"textarea-confirm\"\r\n        :items=\"confirm_type_enum\"\r\n        title=\"设置键盘右下角按钮的文字\"\r\n        @change=\"radio_change_confirm_type_enum\"\r\n      ></enum-data>\r\n      <enum-data\r\n        :items=\"inputmode_enum\" class=\"textarea-input\"\r\n        title=\"是一个枚举属性，它提供了用户在编辑元素或其内容时可能输入的数据类型的提示。在符合条件的高版本webview里，uni-app的 web 和 app-vue 平台中可使用本属性。\"\r\n        @change=\"radio_change_inputmode_enum\"\r\n      ></enum-data>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| textarea | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @confirm | 5.0 | √ | 3.9+ | - | - | - |\n| @input | 5.0 | √ | 3.9+ | - | - | - |\n| @linechange | 5.0 | √ | 3.9+ | - | - | - |\n| @blur | 5.0 | √ | 3.9+ | - | - | - |\n| @keyboardheightchange | 5.0 | √ | 3.9+ | - | - | - |\n| @focus | 5.0 | √ | 3.9+ | - | - | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/textarea)\n"},"video":{"name":"## video","description":"视频","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| loop | Boolean | false | 是否循环播放 |\n| src | String\\|TagVideoURIString | - | 视频资源地址 |\n| initial-time | Number | - | 指定视频初始播放位置 |\n| duration | Number | - | 指定视频长度 |\n| controls | Boolean | true | 是否显示默认播放控件（播放/暂停按钮、播放进度、时间） |\n| danmu-list | Array | - | 弹幕列表 |\n| danmu-btn | Boolean | false | 是否显示弹幕按钮，只在初始化时有效，不能动态变更 |\n| enable-danmu | Boolean | false | 是否展示弹幕，只在初始化时有效，不能动态变更 |\n| autoplay | Boolean | false | 是否自动播放 |\n| muted | Boolean | false | 是否静音播放 |\n| page-gesture | Boolean | false | 在非全屏模式下，是否开启亮度与音量调节手势 |\n| direction | Number | -90 | 设置全屏时视频的方向，不指定则根据宽高比自动判断。有效值为 0（正常竖向）, 90（屏幕逆时针90度）, -90（屏幕顺时针90度） |\n| show-progress | Boolean | true | 若不设置，宽度大于240时才会显示 |\n| show-fullscreen-btn | Boolean | true | 是否显示全屏按钮 |\n| show-play-btn | Boolean | true | 是否显示视频底部控制栏的播放按钮 |\n| show-center-play-btn | Boolean | true | 是否显示视频中间的播放按钮 |\n| show-loading | Boolean | true | 是否显示loading控件 |\n| enable-progress-gesture | Boolean | true | 是否开启控制进度的手势 |\n| objectFit | String | contain | 当视频大小与 video 容器大小不一致时，视频的表现形式。 [objectFit](#objectFit-values) |\n| poster | String | - | 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 |\n| show-mute-btn | Boolean | false | 是否显示静音按钮 |\n| title | String | - | 视频的标题，全屏时在顶部展示 |\n| play-btn-position | String | - | 播放按钮的位置 |\n| enable-play-gesture | Boolean | false | 是否开启播放手势，即双击切换播放、暂停 |\n| auto-pause-if-navigate | Boolean | - | 当跳转到其它小程序页面时，是否自动暂停本页面的视频 |\n| auto-pause-if-open-native | Boolean | - | 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 |\n| vslide-gesture | Boolean | false | 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） |\n| vslide-gesture-in-fullscreen | Boolean | true | 在全屏模式下，是否开启亮度与音量调节手势 |\n| ad-unit-id | String | - | 视频前贴广告单元ID |\n| poster-for-crawler | String | - | 用于给搜索等场景作为视频封面展示，建议使用无播放 icon 的视频封面图，只支持网络地址 |\n| codec | String | hardware | 解码器选择 |\n| http-cache | Boolean | false | 是否对 http、https 视频源开启本地缓存 |\n| play-strategy | Number | 0 | 播放策略 |\n| is-live | Boolean | - | 是否为直播源 |\n| @play | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当开始/继续播放时触发play事件 |\n| @pause | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当暂停播放时，触发pause事件 |\n| @ended | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当播放到视频末尾时触发ended事件 |\n| @timeupdate | (event: [Event](/uni-app-x/component/common#event)) => void | - | 播放进度变化时触发，event.detail = {currentTime, duration} 。触发频率 250ms 一次 |\n| @fullscreenchange | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当视频进入和退出全屏是触发，event.detail = {fullScreen, direction}，direction取为 vertical 或 horizontal |\n| @waiting | (event: [Event](/uni-app-x/component/common#event)) => void | - | 视频出现缓冲时触发 |\n| @error | (event: [Event](/uni-app-x/component/common#event)) => void | - | 播放出错试触发事件 |\n| @progress | (event: [Event](/uni-app-x/component/common#event)) => void | - | 加载进度变化时触发，只支持一段加载。event.detail = {buffered}，百分比 |\n| @loadedmetadata | (event: [Event](/uni-app-x/component/common#event)) => void | - | 视频元数据加载完成时触发。event.detail = {width, height, duration} |\n\n#### objectFit @objectFit-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| contain | 包含 |\n| fill | 填充 |\n| cover | 覆盖 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/video/video.uvue) \n ```html\n<template>\n  <view class=\"uni-flex-item\">\n    <video class=\"video\" ref=\"video\" id=\"video\" :header=\"header\" :src=src :autoplay=\"autoplay\" :loop=\"loop\"\n      :muted=\"muted\" :initial-time=\"initialTime\" :duration=\"duration\" :controls=\"controls\" :danmu-btn=\"danmuBtn\"\n      :enable-danmu=\"enableDanmu\" :page-gesture=\"pageGesture\" :direction=\"direction\" :show-progress=\"showProgress\"\n      :show-fullscreen-btn=\"showFullscreenBtn\" :show-play-btn=\"showPlayBtn\" :show-center-play-btn=\"showCenterPlayBtn\"\n      :show-loading=\"showLoading\" :enable-progress-gesture=\"enableProgressGesture\" :object-fit=\"objectFit\"\n      :poster=\"poster\" :show-mute-btn=\"showMuteBtn\" :title=\"title\" :enable-play-gesture=\"enablePlayGesture\"\n      :vslide-gesture=\"vslideGesture\" :vslide-gesture-in-fullscreen=\"vslideGestureInFullscreen\" :codec=\"codec\"\n      :http-cache=\"httpCache\" :play-strategy=\"playStrategy\" :danmu-list=\"danmuList\" @play=\"onPlay\" @pause=\"onPause\"\n      @ended=\"onEnded\" @timeupdate=\"onTimeUpdate\" @waiting=\"onWaiting\" @error=\"onError\" @progress=\"onProgress\"\n      @fullscreenclick=\"onFullScreenClick\" @controlstoggle=\"onControlsToggle\" @fullscreenchange=\"onFullScreenChange\">\n    </video>\n    <scroll-view class=\"uni-padding-wrap uni-common-mt uni-flex-item\">\n      <view class=\"uni-title\">\n        <text class=\"uni-title-text\">API示例</text>\n      </View>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"play\">播放</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"pause\">暂停</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"seek(pos)\">跳转到指定位置</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"requestFullScreen(requestFullScreenOptions)\">进入全屏</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"exitFullScreen\">退出全屏</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"stop\">停止</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"sendDanmu(danmu)\">发送弹幕</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"playbackRate(rate)\">设置倍速</button>\n      </view>\n      <view class=\"uni-title\">\n        <text class=\"uni-title-text\">属性示例</text>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setSrc(_src)\">设置播放资源</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setAutoplay()\">设置是否自动播放（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setLoop()\">设置是否循环播放（本次播放完成后生效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setMuted()\">设置是否静音播放</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setInitialTime(_initialTime)\">设置初始播放位置（本次播放完成后生效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDuration(_duration)\">设置视频时长（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setControls()\">设置是否显示默认播放控件</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDanmuBtn()\">设置是否显示弹幕按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPageGesture()\">非全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDirection(_direction)\">设置全屏时视频的方向</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowProgress()\">设置是否显示进度条</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowFullscreenBtn()\">设置是否显示全屏按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowPlayBtn()\">设置是否显示视频底部控制栏的播放按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowCenterPlayBtn()\">设置是否显示视频中间的播放按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowLoading()\">设置是否显示loading控件</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setEnableProgressGesture()\">设置是否开启控制进度的手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setObjectFit(_objectFit)\">设置视频大小与video容器大小不一致时，视频的表现形式</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPoster(_poster)\">设置视频封面</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowMuteBtn()\">设置是否显示静音按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setTitle(_title)\">设置视频标题</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setEnablePlayGesture()\">设置是否开启播放手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setVslideGesture()\">非全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setVslideGestureInFullscreen()\">全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setCodec(_codec)\">设置解码器（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setHttpCache()\">设置是否对http、https视频源开启本地缓存（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPlayStrategy(_playStrategy)\">设置播放策略（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setHeader(_header)\">设置header</button>\n      </view>\n    </scroll-view>\n  </view>\n</template>\n\n<script lang=\"uts\">\n  export default {\n    onReady() {\n      this.videoContext = uni.createVideoContext('video', this);\n    },\n    data() {\n      return {\n        videoContext: null as VideoContext | null,\n        // 属性\n        src: \"https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v\",\n        _src: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-app-video-courses.mp4\",\n        autoplay: false,\n        loop: false,\n        muted: false,\n        initialTime: 0,\n        _initialTime: 6,\n        duration: -1,\n        _duration: 60,\n        controls: true,\n        danmuList: [{\n          text: '要显示的文本',\n          color: '#FF0000',\n          time: 3\n        }, {\n          text: '要显示的文本2',\n          color: '#31ff23',\n          time: 5\n        }, {\n          text: '要显示的文本3',\n          color: '#f13ef8',\n          time: 7\n        }, {\n          text: '要显示的文本4',\n          color: '#4972f8',\n          time: 9\n        }, {\n          text: '要显示的文本5',\n          color: '#000000',\n          time: 11\n        }] as Array<Danmu>,\n        danmuBtn: false,\n        enableDanmu: true,\n        pageGesture: false,\n        direction: -90,\n        _direction: 0,\n        requestFullScreenOptions: {\n          direction: -90\n        } as RequestFullScreenOptions,\n        showProgress: true,\n        showFullscreenBtn: true,\n        showPlayBtn: true,\n        showCenterPlayBtn: true,\n        showLoading: true,\n        enableProgressGesture: true,\n        objectFit: \"contain\",\n        _objectFit: \"fill\",\n        poster: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-android.png\",\n        _poster: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-ios.png\",\n        showMuteBtn: false,\n        title: \"video-component\",\n        _title: \"video-component video-component\",\n        enablePlayGesture: false,\n        vslideGesture: false,\n        vslideGestureInFullscreen: true,\n        codec: \"hardware\",\n        _codec: \"software\",\n        httpCache: true,\n        playStrategy: 0,\n        _playStrategy: 2,\n        header: {\n          'User-Agent': 'header test'\n        } as UTSJSONObject,\n        _header: {\n          'User-Agent': 'header test2'\n        } as UTSJSONObject,\n        // API\n        pos: 10,\n        rate: 1.5,\n        danmu: {\n          text: '要显示的文本',\n          color: '#FF0000'\n        } as Danmu,\n        // 自动化测试\n        isPlaying: false,\n        isPause: false,\n        isFullScreen: false\n      }\n    },\n    methods: {\n      // API\n      play: function () {\n        console.log(\"play\");\n        this.videoContext?.play();\n      },\n      pause: function () {\n        console.log(\"pause\");\n        this.videoContext?.pause();\n      },\n      seek: function (pos : number) {\n        console.log(\"seek -> \" + pos);\n        this.videoContext?.seek(pos);\n      },\n      requestFullScreen: function (options : RequestFullScreenOptions) {\n        console.log(\"requestFullScreen -> \" + options);\n        this.videoContext?.requestFullScreen(options);\n      },\n      exitFullScreen: function () {\n        console.log(\"exitFullScreen\");\n        this.videoContext?.exitFullScreen();\n      },\n      stop: function () {\n        console.log(\"stop\");\n        this.videoContext?.stop();\n      },\n      sendDanmu: function (danmu : Danmu) {\n        console.log(\"sendDanmu -> \" + danmu);\n        this.videoContext?.sendDanmu(danmu);\n      },\n      playbackRate: function (rate : number) {\n        console.log(\"playbackRate -> \" + rate);\n        this.videoContext?.playbackRate(rate);\n      },\n      // 属性\n      setSrc: function (src : string) {\n        this.src = src;\n        console.log(\"src -> \" + this.src)\n      },\n      setAutoplay: function () {\n        this.autoplay = !this.autoplay;\n        console.log(\"autoplay -> \" + this.autoplay)\n      },\n      setLoop: function () {\n        this.loop = !this.loop;\n        console.log(\"loop -> \" + this.loop)\n      },\n      setMuted: function () {\n        this.muted = !this.muted;\n        console.log(\"muted -> \" + this.muted)\n      },\n      setInitialTime: function (initialTime : number) {\n        this.initialTime = initialTime;\n        console.log(\"initialTime -> \" + this.initialTime)\n      },\n      setDuration: function (duration : number) {\n        this.duration = duration;\n        console.log(\"duration -> \" + this.duration)\n      },\n      setControls: function () {\n        this.controls = !this.controls;\n        console.log(\"controls -> \" + this.controls)\n      },\n      setDanmuBtn: function () {\n        this.danmuBtn = !this.danmuBtn;\n        console.log(\"danmuBtn -> \" + this.danmuBtn)\n      },\n      setPageGesture: function () {\n        this.pageGesture = !this.pageGesture;\n        console.log(\"pageGesture -> \" + this.pageGesture)\n      },\n      setDirection: function (direction: number) {\n        this.direction = direction;\n        console.log(\"direction -> \" + this.direction)\n      },\n      setShowProgress: function () {\n        this.showProgress = !this.showProgress;\n        console.log(\"showProgress -> \" + this.showProgress)\n      },\n      setShowFullscreenBtn: function () {\n        this.showFullscreenBtn = !this.showFullscreenBtn;\n        console.log(\"showFullscreenBtn -> \" + this.showFullscreenBtn)\n      },\n      setShowPlayBtn: function () {\n        this.showPlayBtn = !this.showPlayBtn;\n        console.log(\"showPlayBtn -> \" + this.showPlayBtn)\n      },\n      setShowCenterPlayBtn: function () {\n        this.showCenterPlayBtn = !this.showCenterPlayBtn;\n        console.log(\"showCenterPlayBtn -> \" + this.showCenterPlayBtn)\n      },\n      setShowLoading: function () {\n        this.showLoading = !this.showLoading;\n        console.log(\"showLoading -> \" + this.showLoading)\n      },\n      setEnableProgressGesture: function () {\n        this.enableProgressGesture = !this.enableProgressGesture;\n        console.log(\"enableProgressGesture -> \" + this.enableProgressGesture)\n      },\n      setObjectFit: function (objectFit : string) {\n        this.objectFit = objectFit;\n        console.log(\"objectFit -> \" + this.objectFit)\n      },\n      setPoster: function (poster : string) {\n        this.poster = poster;\n        console.log(\"poster -> \" + this.poster)\n      },\n      setShowMuteBtn: function () {\n        this.showMuteBtn = !this.showMuteBtn;\n        console.log(\"showMuteBtn -> \" + this.showMuteBtn)\n      },\n      setTitle: function (title : string) {\n        this.title = title;\n        console.log(\"title -> \" + this.title)\n      },\n      setEnablePlayGesture: function () {\n        this.enablePlayGesture = !this.enablePlayGesture;\n        console.log(\"enablePlayGesture -> \" + this.enablePlayGesture)\n      },\n      setVslideGesture: function () {\n        this.vslideGesture = !this.vslideGesture;\n        console.log(\"vslideGesture -> \" + this.vslideGesture)\n      },\n      setVslideGestureInFullscreen: function () {\n        this.vslideGestureInFullscreen = !this.vslideGestureInFullscreen;\n        console.log(\"vslideGestureInFullscreen -> \" + this.vslideGestureInFullscreen)\n      },\n      setCodec: function (codec : string) {\n        this.codec = codec;\n        console.log(\"codec -> \" + this.codec)\n      },\n      setHttpCache: function () {\n        this.httpCache = !this.httpCache;\n        console.log(\"httpCache -> \" + this.httpCache)\n      },\n      setPlayStrategy: function (playStrategy : number) {\n        this.playStrategy = playStrategy;\n        console.log(\"playStrategy -> \" + this.playStrategy)\n      },\n      setHeader: function (header : UTSJSONObject) {\n        this.header = header;\n        console.log(\"header -> \" + this.header)\n      },\n      // 事件\n      onPlay: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isPlaying = true;\n        this.isPause = false;\n      },\n      onPause: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isPlaying = false;\n        this.isPause = true;\n      },\n      onEnded: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onTimeUpdate: function (_ : any) {\n        // console.log(JSON.stringify(res));\n      },\n      onFullScreenChange: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isFullScreen = !this.isFullScreen;\n      },\n      onWaiting: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onError: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onProgress: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onFullScreenClick: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onControlsToggle: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      // 自动化测试\n      playTest: function () {\n        this.videoContext?.play();\n      },\n      pauseTest: function () {\n        this.videoContext?.pause();\n      },\n      requestFullScreenTest: function () {\n        const options : RequestFullScreenOptions = {\n          direction: -90\n        };\n        this.videoContext?.requestFullScreen(options);\n      },\n      exitFullScreenTest: function () {\n        this.videoContext?.exitFullScreen();\n      },\n      stopTest: function () {\n        this.videoContext?.stop();\n      }\n    }\n  }\n</script>\n\n<style>\n  .video {\n    width: 750rpx;\n    height: 400rpx;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| video | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| play-btn-position | 5.0 | x | x | 9.0 | x | - |\n| auto-pause-if-navigate | 5.0 | x | x | 9.0 | x | - |\n| auto-pause-if-open-native | 5.0 | x | x | 9.0 | x | - |\n| ad-unit-id | 5.0 | x | x | 9.0 | x | - |\n| poster-for-crawler | 5.0 | x | x | 9.0 | x | - |\n| is-live | 5.0 | x | x | 9.0 | x | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/video)\n"},"view":{"name":"## view","description":"基本视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| hover-class | 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/master/pages/component/view/view.uvue) \n ```html\n<template>\r\n  <page-head title=\"view\"></page-head>\n  <view class=\"main\" :hover-class=\"hover_class ? 'is-parent-hover' : 'none'\">\n    <view class=\"test-view\" :hover-class=\"hover_class ? 'is-hover' : 'none'\" :hover-stop-propagation=\"stop_propagation\" :hover-start-time=\"start_time\" :hover-stay-time=\"stay_time\">\n    </view>\n  </view>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n    <!-- #endif -->\n    <view class=\"content\">\n      <boolean-data :defaultValue=\"false\" title=\"是否指定按下去的样式类\" @change=\"change_hover_class_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否阻止本节点的祖先节点出现点击态\" @change=\"change_stop_propagation_boolean\"></boolean-data>\n      <enum-data :items=\"start_time_enum\" title=\"按住后多久出现点击态\" @change=\"radio_change_start_time_enum\"></enum-data>\n      <enum-data :items=\"stay_time_enum\" title=\"手指松开后点击态保留时间\" @change=\"radio_change_stay_time_enum\"></enum-data>\n      <view class=\"uni-padding-wrap uni-common-mt uni-common-mb\">\n        <button class=\"uni-common-mt\" @click=\"goGeneralAttribute('/pages/component/view/view-draw')\">DrawableContext</button>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\r\n</template>\r\n<script>\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport 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  },\r\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    },\r\n    goGeneralAttribute(path: string) {\r\n      uni.navigateTo({\r\n        url: path,\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.main {\r\n    padding: 10rpx 0;\r\n    flex-direction: row;\r\n    justify-content: center;\r\n}\r\n.test-view {\n  height: 200px;\n  width: 200px;\n  background-color: white;\n}\r\n.text {\r\n  color: #777;\r\n  font-size: 26rpx;\r\n}\n.is-hover {\r\n    background-color: #179b16;\r\n}\n\n.is-parent-hover {\r\n    background-color: #aa0000;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| view | 5.0 | √ | 3.9+ | - | - | - |\n| hover-class | 5.0 | √ | 3.9+ | - | - | - |\n| hover-stop-propagation | 5.0 | √ | 3.9+ | - | - | - |\n| hover-start-time | 5.0 | √ | 3.9+ | - | - | - |\n| hover-stay-time | 5.0 | √ | 3.9+ | - | - | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/view)\n"},"web-view":{"name":"## web-view","description":"承载网页的容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| src | String\\|URIString | - | webview 指向网页的链接 |\n| webview-styles | WebViewStyles | {\"progress\":{\"color\":\"#00FF00\"}} | webview 的样式 |\n| @message | (event: [WebViewMessageEvent](#webviewmessageevent)) => void | - | 网页向应用 postMessage 时触发。e.detail = { data } |\n| @error | (event: [WebViewErrorEvent](#webviewerrorevent)) => void | - | 网页加载错误时触发。e.detail = { errMsg } |\n| @loaded | (event: [WebViewLoadedEvent](#webviewloadedevent)) => void | - | 网页加载完成后触发。 |\n| @loading | (event: [WebViewLoadingEvent](#webviewloadingevent)) => void | - | 网页加载中触发。 |","event":"\n### 事件\n#### WebViewMessageEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [WebViewMessageEventdetail](#webviewmessageeventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### WebViewMessageEventdetail 属性值 @webviewmessageeventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | Map\\<string, any> | 否 | - |  消息包含的数据 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewErrorEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [WebViewErrorEventdetail](#webviewerroreventdetail-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### WebViewErrorEventdetail 属性值 @webviewerroreventdetail-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewLoadedEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewLoadingEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/web-view/web-view.uvue) \n ```html\n<template>\n  <view class=\"uni-flex-item\">\n    <web-view id=\"web-view\" class=\"uni-flex-item\" :src=\"src\" :webview-styles=\"webview_styles\" @message=\"message\"\n      @error=\"error\" @loading=\"loading\" @loaded=\"loaded\">\n    </web-view>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-input-v\">\n        <input class=\"uni-input\" confirmType=\"go\" placeholder=\"输入网址跳转\" @confirm=\"confirm\" />\n      </view>\n      <view class=\"uni-row uni-btn-v\">\n        <view class=\"uni-flex-item\">\n          <button type=\"primary\" @click=\"back\">后退</button>\n        </view>\n        <view class=\"uni-btn-ml uni-flex-item\">\n          <button type=\"primary\" @click=\"forward\">前进</button>\n        </view>\n      </view>\n      <view class=\"uni-row uni-btn-v\">\n        <view class=\"uni-flex-item\">\n          <button type=\"primary\" @click=\"reload\">重新加载</button>\n        </view>\n        <view class=\"uni-btn-ml uni-flex-item\">\n          <button type=\"primary\" @click=\"stop\">停止加载</button>\n        </view>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"nativeToWeb\">原生和Web通信</button>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n  export default {\n    data() {\n      return {\n        src: 'https://www.dcloud.io',\n        webview_styles: {\n          progress: {\n            color: '#FF3333'\n          }\n        },\n        webviewContext: null as WebviewContext | null,\n        loadError: false\n      }\n    },\n    onReady() {\n      this.webviewContext = uni.createWebviewContext('web-view', this)\n    },\n    methods: {\n      back() {\n        this.webviewContext?.back();\n      },\n      forward() {\n        this.webviewContext?.forward();\n      },\n      reload() {\n        this.webviewContext?.reload();\n      },\n      stop() {\n        this.webviewContext?.stop();\n      },\n      nativeToWeb() {\n        this.webviewContext?.evalJS(\"alert('hello uni-app x')\");\n      },\n      message(event : WebViewMessageEvent) {\n        console.log(JSON.stringify(event.detail));\n      },\n      error(event : WebViewErrorEvent) {\n        this.loadError = true\n        console.log(JSON.stringify(event.detail));\n      },\n      loading(event : WebViewLoadingEvent) {\n        console.log(JSON.stringify(event.type));\n      },\n      loaded(event : WebViewLoadedEvent) {\n        console.log(JSON.stringify(event.type));\n      },\n      confirm(event : InputConfirmEvent) {\n        console.log(event.detail.value);\n        let url = event.detail.value;\n        if (!url.startsWith('https://') && !url.startsWith('http://')) {\n          url = 'https://' + url;\n        }\n        this.src = url;\n      }\n    }\n  }\n</script>\n\n<style>\n  .uni-input-v {\n    padding: 10rpx 0;\n  }\n\n  .uni-btn-ml {\n    margin-left: 10rpx;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| web-view | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/web-view)\n"}}
\ No newline at end of file
+{"animation-view":{"name":"## animation-view","description":"Lottie 动画\n> 本 Component 是 uni ext component，需下载插件：[animation-view](https://ext.dcloud.net.cn/plugin?name=uni-animation-view)\n","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| path | String |  | 动画资源地址，目前只支持绝对路径 |\n| loop | Boolean | false | 动画是否循环播放 |\n| autoplay | Boolean | false | 动画是否自动播放 |\n| action | String | stop | 动画操作，可取值 play、pause、stop [action](#action-values) |\n| hidden | Boolean | false | 是否隐藏动画 |\n| @ended | Any | - | - |\n\n#### action @action-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| play | 播放 |\n| pause | 暂停 |\n| stop | 停止 |\n\n","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| animation-view | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| path | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/animation-view)\n- [插件市场](https://ext.dcloud.net.cn/plugin?id=10674)\n"},"button":{"name":"## button","description":"按钮","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| hover-class | ClassString | button-hover | 指定按下去的样式类。当 hover-class=\"none\" 时，没有点击态效果 |\n| hover-start-time | Number | 20 | 按住后多久出现点击态，单位毫秒 |\n| hover-stay-time | Number | 70 | 手指松开后点击态保留时间，单位毫秒 |\n| size | String | default | 按钮的大小 [size](#size-values) |\n| type | String | default | 按钮的样式类型 [type](#type-values) |\n| plain | Boolean | false | 按钮是否镂空，背景色透明 |\n\n#### size @size-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| default | 默认大小 |\n| mini | 小尺寸 |\n\n\n\n#### type @type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| default | 白色 |\n| primary | 蓝色 |\n| warn | 红色 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/button/button.uvue) \n ```html\n<script>\r\n  import { type ItemType } from '@/components/enum-data/enum-data.vue'\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: 'uni-app-x',\r\n        style: 'color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19;'\r\n      }\r\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    }\r\n  }\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <button :disabled=\"disabled_boolean\" :size=\"size_enum[size_enum_current].name\"\r\n      :type=\"type_enum[type_enum_current].name\" :plain=\"plain_boolean\" @click=\"button_click\"\r\n      @touchstart=\"button_touchstart\" @touchmove=\"button_touchmove\" @touchcancel=\"button_touchcancel\"\r\n      @touchend=\"button_touchend\" @tap=\"button_tap\" @longpress=\"button_longpress\" class=\"btn\"\r\n      :style=\"default_style ? style : ''\" :hover-class=\"default_style ? 'is-hover' : 'button-hover'\">\r\n      {{ text }}\r\n    </button>\r\n  </view>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content\">\r\n      <boolean-data :defaultValue=\"false\" title=\"按钮是否镂空，背景色透明\" @change=\"change_plain_boolean\"></boolean-data>\r\n      <boolean-data :defaultValue=\"false\" title=\"是否禁用\" @change=\"change_disabled_boolean\"></boolean-data>\r\n      <boolean-data :defaultValue=\"false\" title=\"修改默认样式和点击效果(高优先)\" @change=\"change_default_style\"></boolean-data>\r\n      <enum-data :items=\"size_enum\" title=\"按钮的大小\" @change=\"radio_change_size_enum\"></enum-data>\r\n      <enum-data :items=\"type_enum\" title=\"按钮的类型\" @change=\"radio_change_type_enum\"></enum-data>\r\n      <input-data :defaultValue=\"text\" title=\"按钮的文案\" type=\"text\" @confirm=\"confirm_text_input\"></input-data>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n  .main {\r\n    padding: 10rpx 0;\r\n    border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n    flex-direction: row;\r\n    justify-content: center;\r\n  }\r\n\r\n  .main .list-item {\r\n    width: 100%;\r\n    height: 200rpx;\r\n    border: 1px solid #666;\r\n  }\r\n\r\n  .is-hover {\r\n    color: rgba(255, 255, 255, 0.6);\r\n    background-color: #179b16;\r\n    border-color: #179b16;\r\n  }\r\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| button | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-class | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-start-time | 5.0 | √ | √ | 10.0 | √ | x |\n| hover-stay-time | 5.0 | √ | √ | 10.0 | √ | x |\n| size | 5.0 | √ | √ | 10.0 | √ | x |\n| type | 5.0 | √ | √ | 10.0 | √ | x |\n| plain | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/button)\n"},"checkbox":{"name":"## checkbox","description":"多选项。在1组check-group中可选择多个","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String | - | checkbox 标识，选中时触发 checkbox-group 的 change 事件，并携带 checkbox 的 value |\n| checked | Boolean | false | 当前是否选中，可用来设置默认选中 |\n| color | ColorString | #007aff | checkbox的颜色 |\n| backgroundColor | ColorString | #ffffff | checkbox默认的背景颜色 |\n| borderColor | ColorString | #d1d1d1 | checkbox默认的边框颜色 |\n| activeBackgroundColor | ColorString | #ffffff | checkbox选中时的背景颜色 |\n| activeBorderColor | ColorString | #d1d1d1 | checkbox选中时的边框颜色 |\n| iconColor | ColorString | #007aff | checkbox的图标颜色，优先级大于color属性 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/checkbox/checkbox.uvue) \n ```html\n<script>\r\ntype ItemType = {\r\n\tvalue : string\r\n\tname : string\r\n\tchecked : boolean\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\titems: [\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'CHN',\r\n\t\t\t\t\tname: '中国',\r\n\t\t\t\t\tchecked: true,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'USA',\r\n\t\t\t\t\tname: '美国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'BRA',\r\n\t\t\t\t\tname: '巴西',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'JPN',\r\n\t\t\t\t\tname: '日本',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'ENG',\r\n\t\t\t\t\tname: '英国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'FRA',\r\n\t\t\t\t\tname: '法国',\r\n\t\t\t\t\tchecked: false,\r\n\t\t\t\t},\r\n\t\t\t] as ItemType[],\r\n\r\n\t\t\ttext: '未选中',\r\n\t\t\twrapText: 'uni-app x，终极跨平台方案\\nuts，大一统语言',\r\n\t\t\tvalue: [] as string[],\r\n\t\t\tdisabled: true,\r\n\t\t\tchecked: true,\r\n\t\t\tcolor: '#007aff',\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tchecked_boolean: false,\r\n\t\t\tdisabled_boolean: false,\r\n\t\t\tcolor_input: \"#007aff\",\r\n\t\t\tbackgroundColor_input: \"#ffffff\",\r\n\t\t\tborderColor_input: \"#d1d1d1\",\r\n\t\t\tactiveBackgroundColor_input: \"#ffffff\",\r\n\t\t\tactiveBorderColor_input: \"#d1d1d1\",\r\n\t\t\ticonColor_input: \"#007aff\"\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tcheckboxChange: function (e : CheckboxGroupChangeEvent) {\r\n\t\t\tconst selectedNames : string[] = []\r\n\t\t\tthis.items.forEach((item) => {\r\n\t\t\t\tif (e.detail.value.includes(item.value)) {\r\n\t\t\t\t\tselectedNames.push(item.name)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t\tuni.showToast({\r\n\t\t\t\ticon: 'none',\r\n\t\t\t\ttitle: '当前选中:' + selectedNames.join(','),\r\n\t\t\t})\r\n\t\t},\r\n\t\ttestChange: function (e : CheckboxGroupChangeEvent) {\r\n\t\t\tthis.value = e.detail.value\r\n\t\t},\r\n\t\tcheckbox_click() { console.log(\"组件被点击时触发\") },\r\n\t\tcheckbox_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tcheckbox_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tcheckbox_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tcheckbox_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tcheckbox_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tcheckbox_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\tchange_checked_boolean(checked : boolean) { this.checked_boolean = checked },\r\n\t\tchange_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\r\n\t\tconfirm_color_input(value : string) { this.color_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tconfirm_borderColor_input(value : string) { this.borderColor_input = value },\r\n\t\tconfirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\r\n\t\tconfirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\r\n\t\tconfirm_iconColor_input(value : string) { this.iconColor_input = value }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <checkbox\r\n      :disabled=\"disabled_boolean\"\r\n      :checked=\"checked_boolean\"\r\n      :color=\"color_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :borderColor=\"borderColor_input\"\r\n      :activeBackgroundColor=\"activeBackgroundColor_input\"\r\n      :activeBorderColor=\"activeBorderColor_input\"\r\n      :iconColor=\"iconColor_input\"\r\n      @click=\"checkbox_click\"\r\n      @touchstart=\"checkbox_touchstart\"\r\n      @touchmove=\"checkbox_touchmove\"\r\n      @touchcancel=\"checkbox_touchcancel\"\r\n      @touchend=\"checkbox_touchend\"\r\n      @tap=\"checkbox_tap\"\r\n      @longpress=\"checkbox_longpress\"\r\n      ><text>uni-app-x</text></checkbox\r\n    >\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"当前是否选中，可用来设置默认选中\"\r\n        @change=\"change_checked_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否禁用\"\r\n        @change=\"change_disabled_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"#007aff\"\r\n        title=\"checkbox的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_color_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"checkbox默认的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"checkbox默认的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_borderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"checkbox选中时的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBackgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"checkbox选中时的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBorderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#007aff\"\r\n        title=\"checkbox的图标颜色，优先级大于color属性\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_iconColor_input\"\r\n      ></input-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 默认样式 </text>\r\n        </view>\r\n        <view>\r\n          <checkbox-group\r\n            class=\"uni-flex uni-row checkbox-group\"\r\n            @change=\"testChange\"\r\n            style=\"flex-wrap: wrap\"\r\n          >\r\n            <checkbox\r\n              value=\"cb\"\r\n              :checked=\"checked\"\r\n              :color=\"color\"\r\n              style=\"margin-right: 30rpx\"\r\n              class=\"checkbox cb\"\r\n              >选中\r\n            </checkbox>\r\n            <checkbox\r\n              value=\"cb1\"\r\n              style=\"margin-right: 30rpx\"\r\n              class=\"checkbox cb1\"\r\n              >{{ text }}</checkbox\r\n            >\r\n            <checkbox value=\"cb2\" :disabled=\"disabled\" class=\"checkbox cb2\"\r\n              >禁用</checkbox\r\n            >\r\n            <checkbox\r\n              value=\"cb3\"\r\n              style=\"margin-top: 20rpx\"\r\n              class=\"checkbox cb3\"\r\n            >\r\n              {{ wrapText }}\r\n            </checkbox>\r\n          </checkbox-group>\r\n        </view>\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 不同颜色和尺寸的checkbox </text>\r\n        </view>\r\n        <view>\r\n          <checkbox-group class=\"uni-flex uni-row checkbox-group\">\r\n            <checkbox\r\n              value=\"cb1\"\r\n              :checked=\"true\"\r\n              color=\"#FFCC33\"\r\n              style=\"transform: scale(0.7); margin-right: 30rpx\"\r\n              class=\"checkbox\"\r\n              >选中\r\n            </checkbox>\r\n            <checkbox\r\n              value=\"cb\"\r\n              color=\"#FFCC33\"\r\n              style=\"transform: scale(0.7)\"\r\n              class=\"checkbox\"\r\n              >未选中</checkbox\r\n            >\r\n          </checkbox-group>\r\n        </view>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 推荐展示样式 </text>\r\n        </view>\r\n      </view>\r\n      <view class=\"uni-list uni-common-pl\">\r\n        <checkbox-group @change=\"checkboxChange\" class=\"checkbox-group\">\r\n          <checkbox\r\n            class=\"uni-list-cell uni-list-cell-pd checkbox\"\r\n            v-for=\"(item, index) in items\"\r\n            :key=\"item.value\"\r\n            :value=\"item.value\"\r\n            :checked=\"item.checked\"\r\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\"\r\n          >\r\n            {{ item.name }}\r\n          </checkbox>\r\n        </checkbox-group>\r\n      </view>\r\n    </view>\r\n\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.uni-list-cell {\r\n  justify-content: flex-start;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| checkbox | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| checked | 5.0 | √ | √ | 10.0 | √ | x |\n| color | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| borderColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBackgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBorderColor | 5.0 | x | √ | 10.0 | x | x |\n| iconColor | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/checkbox)\n"},"checkbox-group":{"name":"## checkbox-group","description":"多项组，内部由多个checkbox组成","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| @change | (event: [CheckboxGroupChangeEvent](#checkboxgroupchangeevent)) => void | - | checkbox-group中选中项发生改变是触发 change 事件，detail = {value:[选中的checkbox的value的数组\\]} |","event":"\n### 事件\n#### CheckboxGroupChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### CheckboxGroupChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<string\\> | 是 | - | - |\n\n","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| checkbox-group | 5.0 | √ | √ | 10.0 | √ | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [checkbox](#checkbox)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/checkbox)\n"},"image":{"name":"## image","description":"图片","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| src | ImageURIString | - | 图片资源地址 |\n| mode | String | scaleToFill | 图片裁剪、缩放的模式 [mode](#mode-values) |\n| fade-show | Boolean | false | 图片显示动画效果 |\n| @error | (event: [ImageErrorEvent](#imageerrorevent)) => void | - | 图片加载错误时触发，event.detail = { errMsg } |\n| @load | (event: [ImageLoadEvent](#imageloadevent)) => void | - | 图片加载完成时触发，event.detail = { width: '图片宽度px', height: '图片高度px' } |\n\n#### mode @mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| scaleToFill | 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 |\n| aspectFit | 保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。 |\n| aspectFill | 保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取 |\n| widthFix | 宽度不变，高度自动变化，保持原图宽高比不变 |\n| heightFix | 高度不变，宽度自动变化，保持原图宽高比不变 |\n| top | 不缩放图片，只显示图片的顶部区域 |\n| bottom | 不缩放图片，只显示图片的底部区域 |\n| center | 不缩放图片，只显示图片的中间区域 |\n| left | 不缩放图片，只显示图片的左边区域 |\n| right | 不缩放图片，只显示图片的右边区域 |\n| top left | 不缩放图片，只显示图片的左上边区域 |\n| top rigth | 不缩放图片，只显示图片的右上边区域 |\n| bottom left | 不缩放图片，只显示图片的左下边区域 |\n| bottom right | 不缩放图片，只显示图片的右下边区域 |\n\n","event":"\n### 事件\n#### ImageErrorEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ImageErrorEvent detail](#imageerrorevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ImageErrorEvent detail 属性值 @imageerrorevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ImageLoadEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ImageLoadEvent detail](#imageloadevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ImageLoadEvent detail 属性值 @imageloadevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| width | number | 是 | - |  图片宽度 |\n| height | number | 是 | - |  图片高度 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/image/image.uvue) \n ```html\n<template>\r\n\t<view>\r\n\t\t<page-head :title=\"title\"></page-head>\r\n\t\t<view class=\"uni-padding-wrap uni-common-mt\">\r\n\t\t\t<view class=\"uni-center\" style=\"background:#FFFFFF;\">\r\n\t\t\t\t<image class=\"image\" :fade-show=\"true\" mode=\"widthFix\" :src=\"imageSrc\" @error=\"error\"\r\n\t\t\t\t\t@load=\"load\"></image>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageFormat\">图片格式示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageMode\">图片缩放模式示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imagePath\">图片路径示例</button>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-btn-v\">\r\n\t\t\t\t<button type=\"primary\" @tap=\"imageLarge\">大图示例</button>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\ttitle: 'image',\n\t\t\t\timageSrc: \"/static/test-image/logo.png\",\n\t\t\t\tloadError: false\r\n\t\t\t}\r\n\t\t},\r\n\t\tmethods: {\r\n\t\t\terror(event : ImageErrorEvent) {\n\t\t\t\tthis.loadError = true\r\n\t\t\t\tconsole.log(event.type, event.detail);\r\n\t\t\t},\r\n\t\t\tload(event : ImageLoadEvent) {\r\n\t\t\t\tconsole.log(event.type, event.detail);\r\n\t\t\t},\r\n\t\t\timageFormat() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-format'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timageMode() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-mode'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timagePath() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-path'\r\n\t\t\t\t});\r\n\t\t\t},\r\n\t\t\timageLarge() {\r\n\t\t\t\tuni.navigateTo({\r\n\t\t\t\t\turl: '/pages/component/image/image-large'\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n<style>\r\n\t.image {\r\n\t\tmargin: 40rpx auto;\r\n\t\twidth: 200rpx;\r\n\t}\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| image | 5.0 | √ | 3.9.0 | 9.0 | √ | - |\n| src | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| mode | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| fade-show | 5.0 | √ | 3.9.0 | 9.0 | x | x |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/image)\n"},"input":{"name":"## input","description":"输入框","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String |  | 输入框的初始内容 |\n| type | String | text | input的类型 [type](#type-values) |\n| password | Boolean | false | 是否是密码类型 |\n| placeholder | String |  | 输入框为空时占位符 |\n| placeholder-style | String |  | 指定 placeholder 的样式 |\n| placeholder-class | String |  | 指定 placeholder 的样式类 |\n| maxlength | Number | 140 | 最大输入长度，设置为 -1 的时候不限制最大长度 |\n| cursor-spacing | Number | 0 | 指定光标与键盘的距离，单位 px 。取 input 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| auto-focus | Boolean | false | 自动获取焦点 |\n| focus | Boolean | false | 获取焦点 |\n| confirm-type | String | done | 设置键盘右下角按钮的文字 [confirm-type](#confirm-type-values) |\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| @input | (event: [InputEvent](#inputevent)) => void | - | 当键盘输入时，触发input事件，event.detail = {value, cursor}，处理函数可以直接 return 一个字符串，将替换输入框的内容。 |\n| @focus | (event: [InputFocusEvent](#inputfocusevent)) => void | - | 输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持 |\n| @blur | (event: [InputBlurEvent](#inputblurevent)) => void | - | 输入框失去焦点时触发，event.detail = {value: value} |\n| @keyboardheightchange | (event: [InputKeyboardHeightChangeEvent](#inputkeyboardheightchangeevent)) => void | - | 键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration} |\n| @confirm | (event: [InputConfirmEvent](#inputconfirmevent)) => void | - | 点击完成按钮时触发，event.detail = {value: value} |\n\n#### type @type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| text | 文本输入键盘 |\n| number | 数字输入键盘 |\n| digit | 带小数点数字输入键盘 |\n| tel | 电话输入键盘 |\n\n\n\n#### confirm-type @confirm-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| send | 发送 |\n| search | 搜索 |\n| next | 下一个 |\n| go | 前往 |\n| done | 完成 |\n\n","event":"\n### 事件\n#### InputEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputEvent detail](#inputevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputEvent detail 属性值 @inputevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  光标的位置 |\n| keyCode | number | 是 | - |  输入字符的Unicode值 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputFocusEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputFocusEvent detail](#inputfocusevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputFocusEvent detail 属性值 @inputfocusevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputBlurEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputBlurEvent detail](#inputblurevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputBlurEvent detail 属性值 @inputblurevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputKeyboardHeightChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputKeyboardHeightChangeEvent detail](#inputkeyboardheightchangeevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputKeyboardHeightChangeEvent detail 属性值 @inputkeyboardheightchangeevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| duration | number | 是 | - |  持续时间 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputConfirmEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputConfirmEvent detail](#inputconfirmevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputConfirmEvent detail 属性值 @inputconfirmevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/input/input.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n  <!-- #endif -->\r\n    <page-head :title=\"title\"></page-head>\r\n    <view class=\"uni-common-mt uni-padding-wrap\">\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置输入框的初始内容</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-default\" value=\"hello uni-app x\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">type取值（不同输入法表现可能不一致）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-text\" type=\"text\" placeholder=\"文本输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-number\" type=\"number\" placeholder=\"数字输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-digit\" type=\"digit\" placeholder=\"带小数点的数字输入键盘\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-type-tel\" :type=\"inputTypeTel\" placeholder=\"电话输入键盘\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">密码输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-password\" :password=\"inputPassword\" :value=\"inputPasswordValue\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">占位符样式</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-placeholder1\" :placeholder-style=\"inputPlaceHolderStyle\" placeholder=\"占位符文字颜色为红色\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-placeholder2\" :placeholder-class=\"inputPlaceHolderClass\" placeholder=\"占位符背景色为绿色\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置禁用输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-disable\" :disabled=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置最大输入长度</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-maxlength\" :maxlength=\"10\" placeholder=\"最大输入长度为10\" :value=\"inputMaxLengthValue\" @input=\"onMaxLengthInput\" :focus=\"inputMaxLengthFocus\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">设置光标与键盘的距离</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :cursor-spacing=\"1000\" placeholder=\"光标与键盘的距离为1000px\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">自动获取焦点</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-focus\" :focus=\"focus\" @keyboardheightchange=\"inputFocusKeyBoardChange\"/>\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">confirm-type取值（不同输入法表现可能不一致）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-send\" confirmType=\"send\" placeholder=\"键盘右下角按钮显示为发送\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-search\" confirmType=\"search\" placeholder=\"键盘右下角按钮显示为搜索\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-next\" confirmType=\"next\" placeholder=\"键盘右下角按钮显示为下一个\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-go\" confirmType=\"go\" placeholder=\"键盘右下角按钮显示为前往\" />\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input uni-input-confirm-done\" confirmType=\"done\" placeholder=\"键盘右下角按钮显示为完成\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">点击键盘右下角按钮时保持键盘不收起</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :confirm-hold=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\" @click=\"setCursor(4)\">\r\n          <text class=\"uni-title-text\">设置输入框聚焦时光标的位置（点击生效）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input ref=\"input\" class=\"uni-input\" value=\"0123456789\" :cursor=\"cursor\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\" @click=\"setSelection(0, 4)\">\r\n          <text class=\"uni-title-text\">设置输入框聚焦时光标的起始位置和结束位置（点击生效）</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input ref=\"input2\" class=\"uni-input\" value=\"0123456789\" :selection-start=\"selectionStart\" :selection-end=\"selectionEnd\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">键盘弹起时，自动上推页面</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" :adjust-position=\"true\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">input事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"inputEventDetail\">{{inputEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @input=\"onInput\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">focus事件和blur事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"focusAndBlurEventDetail\">{{focusAndBlurEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @focus=\"onFocus\" @blur=\"onBlur\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">confirm事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"confirmEventDetail\">{{confirmEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @confirm=\"onConfirm\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">keyboardheightchange事件</text>\r\n          <text class=\"uni-subtitle-text\" v-if=\"keyboardHeightChangeEventDetail\">{{keyboardHeightChangeEventDetail}}</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" @keyboardheightchange=\"onKeyborardHeightChange\" />\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">带清除按钮的输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" placeholder=\"带清除按钮的输入框\" :value=\"inputClearValue\" @input=\"clearInput\" />\r\n          <image class=\"uni-icon\" src=\"/static/icons/clear.png\" v-if=\"showClearIcon\" @click=\"clearIcon\">\r\n          </image>\r\n        </view>\r\n      </view>\r\n\r\n      <view>\r\n        <view class=\"uni-title\">\r\n          <text class=\"uni-title-text\">可查看密码的输入框</text>\r\n        </view>\r\n        <view class=\"uni-input-wrapper\">\r\n          <input class=\"uni-input\" placeholder=\"请输入密码\" :password=\"showPassword\" />\r\n          <image class=\"uni-icon\" :src=\"!showPassword ? '/static/icons/eye-active.png' : '/static/icons/eye.png'\" @click=\"changePassword\"></image>\r\n        </view>\r\n      </view>\r\n    </view>\r\n  <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n<script lang=\"uts\">\r\n  export default {\r\n    data() {\r\n      return {\r\n        title: 'input',\r\n        showClearIcon: false,\r\n        inputClearValue: '',\r\n        showPassword: true,\r\n        cursor: -1,\r\n        selectionStart: -1,\r\n        selectionEnd: -1,\r\n        inputEventDetail: '',\r\n        focusAndBlurEventDetail: '',\r\n        confirmEventDetail: '',\r\n        keyboardHeightChangeEventDetail: '',\r\n        focus: true,\r\n        inputPassword: true,\r\n        inputTypeTel: \"tel\",\r\n        inputPlaceHolderStyle: \"color:red\",\r\n        inputPlaceHolderClass: \"uni-input-placeholder-class\",\n        inputMaxLengthValue:\"\",\n        onMaxLengthInputValue:\"\",\n        inputMaxLengthFocus:false,\n        inputPasswordValue:\"\",\n        inputFocusKeyBoardChangeValue:true\r\n      }\r\n    },\r\n    methods: {\n      inputFocusKeyBoardChange(e:InputKeyboardHeightChangeEvent) {\n        this.inputFocusKeyBoardChangeValue = e.detail.height > 50\n      },\n      onMaxLengthInput(event:InputEvent) {\n        this.onMaxLengthInputValue = event.detail.value\n      },\r\n      setCursor: function (cursor : number) {\r\n        (this.$refs['input'] as Element).focus();\r\n        this.cursor = cursor;\r\n      },\r\n      setSelection: function (selectionStart : number, selectionEnd : number) {\r\n        (this.$refs['input2'] as Element).focus();\r\n        this.selectionStart = selectionStart;\r\n        this.selectionEnd = selectionEnd;\r\n      },\r\n      clearInput: function (event : InputEvent) {\r\n        this.inputClearValue = event.detail.value\r\n        if (event.detail.value.length > 0) {\r\n          this.showClearIcon = true\r\n        } else {\r\n          this.showClearIcon = false\r\n        }\r\n      },\r\n      clearIcon: function () {\r\n        this.inputClearValue = ''\r\n        this.showClearIcon = false\r\n      },\r\n      changePassword: function () {\r\n        this.showPassword = !this.showPassword\r\n      },\r\n      onInput: function (event : InputEvent) {\r\n        console.log(\"键盘输入\", JSON.stringify(event.detail));\r\n        this.inputEventDetail = JSON.stringify(event.detail)\r\n      },\r\n      onFocus: function (event : InputFocusEvent) {\r\n        console.log(\"输入框聚焦\", JSON.stringify(event.detail));\r\n        this.focusAndBlurEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onBlur: function (event : InputBlurEvent) {\r\n        console.log(\"输入框失去焦点\", JSON.stringify(event.detail));\r\n        this.focusAndBlurEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onConfirm: function (event : InputConfirmEvent) {\r\n        console.log(\"点击完成按钮\", JSON.stringify(event.detail));\r\n        this.confirmEventDetail = JSON.stringify(event.detail);\r\n      },\r\n      onKeyborardHeightChange: function (event : InputKeyboardHeightChangeEvent) {\r\n        console.log(\"键盘高度发生变化\", JSON.stringify(event.detail));\r\n        this.keyboardHeightChangeEventDetail = JSON.stringify(event.detail);\r\n      },\n      test_check_input_value():number {\n        return this.onMaxLengthInputValue.length\n      }\r\n    }\r\n  }\r\n</script>\r\n\r\n<style scoped>\r\n  .uni-input-wrapper {\r\n    display: flex;\r\n    padding: 8px 13px;\r\n    margin: 10rpx 0;\r\n    flex-direction: row;\r\n    flex-wrap: nowrap;\r\n    background-color: #ffffff;\r\n  }\r\n\r\n  .uni-input {\r\n    height: 28px;\r\n    font-size: 15px;\r\n    padding: 0px;\r\n    flex: 1;\r\n    background-color: #ffffff;\r\n  }\r\n\r\n  .uni-icon {\r\n    width: 24px;\r\n    height: 24px;\r\n  }\r\n\r\n  .uni-input-placeholder-class {\r\n    background-color: green;\r\n  }\n  .uni-input-placeholder-class-ts {\n    background-color: orange;\n  }\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| input | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/input)\n"},"list-item":{"name":"## list-item","description":"list-view组件的唯一合法子组件。每个item是一行","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| type | Number | 0 | 对应list-item的类型 List 将对同类型条目进行复用，所以合理的类型拆分，可以很好地提升 List 性能 |","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| list-item | 5.0 | x | 3.9+ | 9.0 | x | - |\n| type | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/uni-app-x/component/list-view#list-item)\n"},"list-view":{"name":"## list-view","description":"列表组件","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| scroll-x | Boolean | false | 允许横向滚动，不支持同时设置scroll-y属性为true，同时设置true时scroll-y生效 |\n| scroll-y | Boolean | true | 允许纵向滚动，不支持同时设置scroll-x属性为true，同时设置true时scroll-y生效 |\n| rebound | Boolean | true | 控制是否回弹效果 |\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 | - | 值应为某子元素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！list-view暂时不支持使用自定义样式 |\n| refresher-background | String | #FFF | 设置下拉刷新区域背景颜色 |\n| refresher-triggered | Boolean | false | 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 |\n| custom-nested-scroll | Boolean | - | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| @refresherpulling | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被触发 |\n| @refresherrestore | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被复位 |\n| @refresherabort | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被中止 |\n| @scrolltoupper | (event: [ScrollToUpperEvent](#scrolltoupperevent)) => void | - | 滚动到顶部/左边，会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [ScrollToLowerEvent](#scrolltolowerevent)) => void | - | 滚动到底部/右边，会触发 scrolltolower 事件 |\n| @scroll | (event: [ScrollEvent](#scrollevent)) => void | - | 滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |","event":"\n### 事件\n#### RefresherEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RefresherEvent detail](#refresherevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RefresherEvent detail 属性值 @refresherevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToUpperEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToUpperEvent detail](#scrolltoupperevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToUpperEvent detail 属性值 @scrolltoupperevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 top 或 left |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToLowerEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToLowerEvent detail](#scrolltolowerevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToLowerEvent detail 属性值 @scrolltolowerevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 bottom 或 right |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollEvent detail](#scrollevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollEvent detail 属性值 @scrollevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 是 | - |  竖向滚动的距离 |\n| scrollLeft | number | 是 | - |  横向滚动的距离 |\n| scrollHeight | number | 是 | - |  滚动区域的高度 |\n| scrollWidth | number | 是 | - |  滚动区域的宽度 |\n| deltaY | number | 是 | - |  当次滚动事件竖向滚动量 |\n| deltaX | number | 是 | - |  当次滚动事件横向滚动量 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/list-view/list-view.uvue) \n ```html\n<script>\n  import { type ItemType } from '@/components/enum-data/enum-data.vue'\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: true,\n        rebound_boolean: true,\n        scroll_y_boolean: true,\n        scroll_x_boolean: false,\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<string>,\n        size_enum: [{ \"value\": 0, \"name\": \"item---0\" }, { \"value\": 3, \"name\": \"item---3\" }] as ItemType[],\n        scrollIntoView: \"\",\n        refresherrefresh: false\n      }\n    },\n    onLoad() {\n      let lists : Array<string> = []\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() { console.log(\"下拉刷新控件被下拉\") },\n      list_view_refresherrefresh() {\n        console.log(\"下拉刷新被触发 \")\n        this.refresherrefresh = true\n        this.refresher_triggered_boolean = true\n        setTimeout(function(){\n        \tthis.refresher_triggered_boolean = false\n        }, 1500)\n      },\n      list_view_refresherrestore() {\n        this.refresherrefresh = false\n        console.log(\"下拉刷新被复位\")\n      },\n      list_view_refresherabort() { console.log(\"下拉刷新被中止\") },\n      list_view_scrolltoupper(e:ScrollToUpperEvent) { console.log(\"滚动到顶部/左边，会触发 scrolltoupper 事件  direction=\"+e.detail.direction) },\n      list_view_scrolltolower(e:ScrollToLowerEvent) { console.log(\"滚动到底部/右边，会触发 scrolltolower 事件  direction=\"+e.detail.direction) },\n      list_view_scroll() { console.log(\"滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}\") },\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_rebound_boolean(checked : boolean) { this.rebound_boolean = checked },\n      change_scroll_y_boolean(checked : boolean) { this.scroll_y_boolean = checked },\n      change_scroll_x_boolean(checked : boolean) { this.scroll_x_boolean = checked },\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 },\r\n      //自动化测试例专用\n      check_scroll_height(): Boolean {\r\n        var listElement = this.$refs[\"listview\"] as Element\n        console.log(\"check_scroll_height--\"+listElement.scrollHeight)\r\n        if(listElement.scrollHeight > 2000) {\r\n          return true\r\n        }\r\n        return false\r\n      },\n      //自动化测试例专用\r\n      check_scroll_width(): Boolean {\r\n        var listElement = this.$refs[\"listview\"] as Element\n        console.log(\"check_scroll_width\"+listElement.scrollWidth)\n        if(listElement.scrollWidth > 2000) {\n          return true\n        }\r\n        return false\r\n      }\n    }\n  }\n</script>\n\n<template>\n  <view class=\"main\">\n    <list-view :scroll-x=\"scroll_x_boolean\" :scroll-y=\"scroll_y_boolean\" :rebound=\"rebound_boolean\"\n      :upper-threshold=\"upper_threshold_input\" :lower-threshold=\"lower_threshold_input\" :scroll-top=\"scroll_top_input\"\n      :scroll-left=\"scroll_left_input\" :show-scrollbar=\"show_scrollbar_boolean\" :scroll-into-view=\"scrollIntoView\"\n      :scroll-with-animation=\"scroll_with_animation_boolean\" :refresher-enabled=\"refresher_enabled_boolean\"\n      :refresher-background=\"refresher_background_input\" :refresher-triggered=\"refresher_triggered_boolean\"\n      @click=\"list_view_click\" @touchstart=\"list_view_touchstart\" @touchmove=\"list_view_touchmove\"\n      @touchcancel=\"list_view_touchcancel\" @touchend=\"list_view_touchend\" @tap=\"list_view_tap\"\n      @longpress=\"list_view_longpress\" @refresherpulling=\"list_view_refresherpulling\"\n      @refresherrefresh=\"list_view_refresherrefresh\" @refresherrestore=\"list_view_refresherrestore\"\n      @refresherabort=\"list_view_refresherabort\" @scrolltoupper=\"list_view_scrolltoupper\" ref=\"listview\" id=\"listview\"\n      @scrolltolower=\"list_view_scrolltolower\" @scroll=\"list_view_scroll\" style=\"width:100%;\">\n      <list-item\n        v-for=\"key in scrollData\" :key=\"key\" :id=\"key\" @click=\"list_item_click\" @touchstart=\"list_item_touchstart\"\n        @touchmove=\"list_item_touchmove\" @touchcancel=\"list_item_touchcancel\" @touchend=\"list_item_touchend\"\n        @tap=\"list_item_tap\" @longpress=\"list_item_longpress\"\n        class=\"list-item\">\n        <text>{{key}}</text>\n      </list-item>\n    </list-view>\n  </view>\n\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex:1\">\n    <!-- #endif -->\n    <view class=\"content nvue\">\n      <boolean-data :defaultValue=\"false\" title=\"设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发\"\n        @change=\"change_refresher_triggered_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"开启下拉刷新\" @change=\"change_refresher_enabled_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否在设置滚动条位置时使用滚动动画，设置false没有滚动动画\"\n        @change=\"change_scroll_with_animation_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"控制是否出现滚动条\" @change=\"change_show_scrollbar_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"控制是否回弹效果\" @change=\"change_rebound_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"true\" title=\"允许纵向滚动\" @change=\"change_scroll_y_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"允许横向滚动\" @change=\"change_scroll_x_boolean\"></boolean-data>\n      <input-data defaultValue=\"50\" title=\"距顶部/左边多远时（单位px），触发 scrolltoupper 事件\" type=\"number\"\n        @confirm=\"confirm_upper_threshold_input\"></input-data>\n      <input-data defaultValue=\"50\" title=\"距底部/右边多远时（单位px），触发 scrolltolower 事件\" type=\"number\"\n        @confirm=\"confirm_lower_threshold_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"设置竖向滚动条位置\" type=\"number\" @confirm=\"confirm_scroll_top_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"设置横向滚动条位置\" type=\"number\" @confirm=\"confirm_scroll_left_input\"></input-data>\n      <input-data defaultValue=\"#FFF\" title=\"设置下拉刷新区域背景颜色\" type=\"text\"\n        @confirm=\"confirm_refresher_background_input\"></input-data>\n      <enum-data :items=\"size_enum\" title=\"通过id位置跳转\" @change=\"item_change_size_enum\"></enum-data>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<style>\n  .main {\n    max-height: 500rpx;\n    padding: 10rpx 0;\n    border-bottom: 1px solid rgba(0, 0, 0, .06);\n    flex-direction: row;\n    justify-content: center;\n  }\n\n  .main .list-item {\n    width: 750rpx;\n    height: 480rpx;\n    border: 1px solid #666;\n    background-color: #66ccff;\n    align-items: center;\n    justify-content: center;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| list-view | 5.0 | x | 3.9+ | 9.0 | x | - |\n| scroll-x | 5.0 | x | 3.9+ | - | - | - |\n| scroll-y | 5.0 | x | 3.9+ | - | - | - |\n| rebound | 5.0 | x | 3.9+ | - | - | - |\n| upper-threshold | 5.0 | x | 3.9+ | - | - | - |\n| lower-threshold | 5.0 | x | 3.9+ | - | - | - |\n| scroll-top | 5.0 | x | 3.9+ | - | - | - |\n| scroll-left | 5.0 | x | 3.9+ | - | - | - |\n| show-scrollbar | 5.0 | x | 3.9+ | - | - | - |\n| scroll-into-view | 5.0 | x | 3.9+ | - | - | - |\n| scroll-with-animation | 5.0 | x | 3.9+ | - | - | - |\n| refresher-enabled | 5.0 | x | 3.9+ | - | - | - |\n| refresher-threshold | 5.0 | x | 3.9+ | - | - | - |\n| refresher-max-drag-distance | 5.0 | x | 3.9+ | - | - | - |\n| refresher-default-style | 5.0 | x | 3.9+ | - | - | - |\n| refresher-background | 5.0 | x | 3.9+ | - | - | - |\n| refresher-triggered | 5.0 | x | 3.9+ | - | - | - |\n| custom-nested-scroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherpulling | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherrefresh | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherrestore | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @refresherabort | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scrolltoupper | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scrolltolower | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @scroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"### 子组件 @children-tags \n - [list-item](#list-item)","reference":""},"navigator":{"name":"## navigator","description":"页面链接","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| target | String | - | 在哪个目标上发生跳转，默认当前应用 |\n| url | String\\|PageURIString | - | 当前应用内的跳转链接 |\n| open-type | String | - | 跳转方式 [open-type](#open-type-values) |\n| delta | Number | - | 当 open-type 为 navigateBack 时有效，表示回退的层数 |\n| app-id | String | - | 当target=\"miniProgram\"时有效，要打开的小程序 appId |\n| path | String | - | 当target=\"miniProgram\"时有效，打开的页面路径，如果为空则打开首页 |\n| extra-data | Object | - | 当target=\"miniProgram\"时有效，需要传递给目标应用的数据，目标应用可在 App.onLaunch()，App.onShow() 中获取到这份数据 |\n| version | String | - | 当target=\"miniProgram\"时有效，要打开的小程序版本，有效值 develop（开发版），trial（体验版），release（正式版），仅在当前小程序为开发版或体验版时此参数有效；如果当前小程序是体验版或正式版，则打开的小程序必定是正式版 |\n| animation-type | String | - | 当 open-type=\"navigateTo\" 或 open-type=\"navigateBack\" 时有效，窗口的显示/关闭的动画类型。 [animation-type](#animation-type-values) |\n| animation-duration | Number | - | 当 open-type=\"navigateTo\" 或 open-type=\"navigateBack\" 时有效，窗口的显示/关闭动画的持续时间。 |\n| hover-class | String | - | 指定按下去的样式类。当 hover-class=\"none\" 时，没有点击态效果 |\n| hover-stop-propagation | Boolean | - | 指定是否阻止本节点的祖先节点出现点击态 |\n| hover-start-time | Number | - | 按住后多久出现点击态，单位毫秒 |\n| hover-stay-time | Number | - | 手指松开后点击态保留时间，单位毫秒 |\n\n#### open-type @open-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| navigate | 对应 wx.navigateTo 或 wx.navigateToMiniProgram 的功能 |\n| redirect | 对应 wx.redirectTo 的功能 |\n| switchTab | 对应 wx.switchTab 的功能 |\n| reLaunch | 对应 wx.reLaunch 的功能 |\n| navigateBack | 对应 wx.navigateBack 的功能 |\n\n\n\n#### animation-type @animation-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| auto | 自动选择动画效果 |\n| none | 无动画效果 |\n| slide-in-right | 从右侧横向滑动效果 |\n| slide-in-left | 左侧横向滑动效果 |\n| slide-in-top | 从上侧竖向滑动效果 |\n| slide-in-bottom | 从下侧竖向滑动效果 |\n| fade-in | 从透明到不透明逐渐显示效果 |\n| zoom-out | 从小到大逐渐放大显示效果 |\n| zoom-fade-out | 从小到大逐渐放大并且从透明到不透明逐渐显示效果 |\n| pop-in | 从右侧平移入栈动画效果 |\n| slide-out-right | 横向向右侧滑出屏幕动画 |\n| slide-out-left | 横向向左侧滑出屏幕动画 |\n| slide-out-top | 竖向向上侧滑出屏幕动画 |\n| slide-out-bottom | 竖向向下侧滑出屏幕动画 |\n| fade-out | 从不透明到透明逐渐隐藏动画 |\n| zoom-in | 从大逐渐缩小关闭动画 |\n| zoom-fade-in | 从大逐渐缩小并且从不透明到透明逐渐隐藏关闭动画 |\n| pop-out | 从右侧平移出栈动画效果 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/navigator/navigator.uvue) \n ```html\n<template>\n  <view>\n    <page-head :title=\"title\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <navigator class=\"navigator navigate\" url=\"navigate?title=navigate\">\n        <button type=\"default\">跳转到新页面</button>\n      </navigator>\n      <navigator class=\"navigator redirect\" url=\"redirect?title=redirect\" open-type=\"redirect\">\n        <button type=\"default\">在当前页打开</button>\n      </navigator>\n    </view>\n  </view>\n</template>\n\n<script>\n  export default {\n    data() {\n      return {\n        title: 'navigator'\n      }\n    }\n  }\n</script>\n\n<style>\n  .navigator {\n    margin-bottom: 15px;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| navigator | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| url | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| open-type | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| path | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| animation-type | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| animation-duration | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/navigator)\n"},"picker-view-column":{"name":"## picker-view-column","description":"仅可放置于 picker-view 中，其子节点未继承 picker-view 的选中框的高度，需要自己设置高度并居中","attrubute":"","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| picker-view-column | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.net.cn/component/picker-view.html#picker-view-column)\n"},"picker-view":{"name":"## picker-view","description":"嵌入页面的滚动选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| value | Array\\<Number> | - | picker-view-column 选择的第几项 |\n| indicator-style | CSSString | - | 设置选择器中间选中框的样式 |\n| mask-top-style | CSSString | - | 设置蒙层上半部分的样式 |\n| mask-bottom-style | CSSString | - | 设置蒙层下半部分的样式 |\n| @change | (event: [PickerViewChangeEvent](#pickerviewchangeevent)) => void | - | 当滚动选择，value 改变时触发 change 事件，event.detail = {value: value}；value为数组，表示 picker-view 内的 picker-view-column 当前选择的是第几项（下标从 0 \t\t开始） |","event":"\n### 事件\n#### PickerViewChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### PickerViewChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | Array\\<number\\> | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/picker-view/picker-view.uvue) \n ```html\n<template>\r\n    <view>\r\n        <page-head :title=\"title\"></page-head>\r\n        <view class=\"uni-padding-wrap\">\r\n            <view class=\"uni-title\">\r\n                日期：{{year}}年{{month}}月{{day}}日\r\n            </view>\r\n        </view>\r\n        <picker-view class=\"picker-view\" :indicator-style=\"indicatorStyle\" :value=\"value\" @change=\"bindChange\"\r\n            :mask-top-style=\"maskTopStyle\" :mask-bottom-style=\"maskBottomStyle\">\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in years\" :key=\"index\"><text class=\"text\">{{item}}年</text></view>\r\n            </picker-view-column>\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in months\" :key=\"index\"><text class=\"text\">{{item}}月</text>\r\n                </view>\r\n            </picker-view-column>\r\n            <picker-view-column class=\"picker-view-column\">\r\n                <view class=\"item\" v-for=\"(item,index) in days\" :key=\"index\"><text class=\"text\">{{item}}日</text></view>\r\n            </picker-view-column>\r\n        </picker-view>\r\n    </view>\r\n</template>\r\n\r\n<script lang=\"uts\">\r\n    export default {\r\n        data() {\r\n            const date = new Date()\n            const _years : number[] = []\n            const _year = date.getFullYear()\n            const _months : number[] = []\n            const _month : number = date.getMonth() + 1\n            const _days : number[] = []\n            const _day = date.getDate()\n            for (let i = 2000; i <= _year; i++) {\n                _years.push(i)\n            }\n            for (let i = 1; i <= 12; i++) {\n                _months.push(i)\n            }\n            for (let i = 1; i <= 31; i++) {\n                _days.push(i)\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: {\r\n\t\t\tclickView() {\r\n\t\t\t\t\r\n\t\t\t},\r\n            bindChange(e : PickerViewChangeEvent) {\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</script>\r\n\r\n<style>\r\n    .picker-view {\r\n        width: 100%;\r\n        height: 320px;\r\n        margin-top: 10px;\r\n    }\r\n\r\n    .item {\r\n        height: 50px;\r\n    }\r\n\r\n    .text {\r\n        line-height: 50px;\r\n        text-align: center;\r\n    }\r\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| picker-view | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| indicator-style | 5.0 | √ | √ | 10.0 | √ | x |\n| mask-top-style | 5.0 | x | √ | 10.0 | x | x |\n| mask-bottom-style | 5.0 | x | √ | 10.0 | x | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [picker-view-column](#picker-view-column)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/picker-view)\n"},"progress":{"name":"## progress","description":"进度条","attrubute":"### 属性 \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| color | ColorString | - | 进度条颜色 （请使用 activeColor） |\n| activeColor | ColorString | #09BB07 | 已选择的进度条的颜色 |\n| backgroundColor | ColorString | #EBEBEB | 未选择的进度条的颜色 |\n| active | Boolean | false | 进度条从左往右的动画 |\n| active-mode | String | backwards | backwards: 动画从头播；forwards：动画从上次结束点接着播 [active-mode](#active-mode-values) |\n| @activeend | (event: [ProgressActiveendEvent](#progressactiveendevent)) => void | - | 动画完成事件 |\n\n#### active-mode @active-mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| backwards | 动画从头播 |\n| forwards | 动画从上次结束点接着播 |\n\n","event":"\n### 事件\n#### ProgressActiveendEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ProgressActiveendEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| curPercent | number | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/progress/progress.uvue) \n ```html\n<script>\r\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\ttitle: 'progress',\r\n\t\t\tpgList: [0, 0, 0, 0] as number[],\r\n\t\t\tcurPercent: 0,\r\n\t\t\tshowInfo: true,\r\n\t\t\tborderRadius: 0,\r\n\t\t\tfontSize: 16,\r\n\t\t\tstrokeWidth: 3,\r\n\t\t\tbackgroundColor: '#EBEBEB',\r\n\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tactive_boolean: false,\r\n\t\t\tshow_info_boolean: false,\r\n\t\t\tduration_input: 30,\r\n\t\t\tpercent_input: 0,\r\n\t\t\tstroke_width_input: 6,\r\n\t\t\tactiveColor_input: \"#09BB07\",\r\n\t\t\tbackgroundColor_input: \"#EBEBEB\",\r\n\t\t\tactive_mode_enum: [{ \"value\": 0, \"name\": \"backwards\" }, { \"value\": 1, \"name\": \"forwards\" }] as ItemType[],\r\n\t\t\tactive_mode_enum_current: 0\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tsetProgress() {\r\n\t\t\tthis.pgList = [20, 40, 60, 80] as number[]\r\n\t\t},\r\n\t\tclearProgress() {\r\n\t\t\tthis.pgList = [0, 0, 0, 0] as number[]\r\n\t\t},\r\n\t\tactiveend(e : ProgressActiveendEvent) {\r\n\t\t\tthis.curPercent = e.detail.curPercent\r\n\t\t},\r\n\t\tprogress_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tprogress_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tprogress_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tprogress_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tprogress_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tchange_active_boolean(checked : boolean) { this.active_boolean = checked },\r\n\t\tchange_show_info_boolean(checked : boolean) { this.show_info_boolean = checked },\r\n\t\tconfirm_duration_input(value : number) { this.duration_input = value },\r\n\t\tconfirm_percent_input(value : number) { this.percent_input = value },\r\n\t\tconfirm_stroke_width_input(value : number) { this.stroke_width_input = value },\r\n\t\tconfirm_activeColor_input(value : string) { this.activeColor_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tradio_change_active_mode_enum(checked : number) { this.active_mode_enum_current = checked }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <progress\r\n      :duration=\"duration_input\"\r\n      :percent=\"percent_input\"\r\n      :show-info=\"show_info_boolean\"\r\n      :stroke-width=\"stroke_width_input\"\r\n      :activeColor=\"activeColor_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :active=\"active_boolean\"\r\n      :active-mode=\"active_mode_enum[active_mode_enum_current].name\"\r\n      @touchstart=\"progress_touchstart\"\r\n      @touchmove=\"progress_touchmove\"\r\n      @touchcancel=\"progress_touchcancel\"\r\n      @touchend=\"progress_touchend\"\r\n      @tap=\"progress_tap\"\r\n      style=\"width: 80%\"\r\n    >\r\n      <text>uni-app-x</text>\r\n    </progress>\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"进度条从左往右的动画\"\r\n        @change=\"change_active_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"在进度条右侧显示百分比\"\r\n        @change=\"change_show_info_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"30\"\r\n        title=\"进度增加1%所需毫秒数\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_duration_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"0\"\r\n        title=\"百分比0~100\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_percent_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"6\"\r\n        title=\"进度条线的宽度，单位px\"\r\n        type=\"number\"\r\n        @confirm=\"confirm_stroke_width_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#09BB07\"\r\n        title=\"已选择的进度条的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#EBEBEB\"\r\n        title=\"未选择的进度条的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <enum-data\r\n        :items=\"active_mode_enum\"\r\n        title=\"backwards: 动画从头播；forwards：动画从上次结束点接着播\"\r\n        @change=\"radio_change_active_mode_enum\"\r\n      ></enum-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap uni-common-mt\">\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[0]\"\r\n            :active=\"true\"\r\n            :border-radius=\"borderRadius\"\r\n            :show-info=\"showInfo\"\r\n            :font-size=\"fontSize\"\r\n            :stroke-width=\"strokeWidth\"\r\n            :background-color=\"backgroundColor\"\r\n            class=\"progress p\"\r\n            @activeend=\"activeend\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[1]\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p1\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[2]\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p2\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-box\">\r\n          <progress\r\n            :percent=\"pgList[3]\"\r\n            activeColor=\"#10AEFF\"\r\n            :stroke-width=\"3\"\r\n            class=\"progress p3\"\r\n          />\r\n        </view>\r\n        <view class=\"progress-control\">\r\n          <button type=\"primary\" @click=\"setProgress\" class=\"button\">\r\n            设置进度\r\n          </button>\r\n          <button type=\"warn\" @click=\"clearProgress\" class=\"button\">\r\n            清除进度\r\n          </button>\r\n        </view>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.progress-box {\r\n  height: 50rpx;\r\n  margin-bottom: 60rpx;\r\n}\r\n\r\n.progress-cancel {\r\n  margin-left: 40rpx;\r\n}\r\n\r\n.button {\r\n  margin-top: 20rpx;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| progress | 5.0 | √ | √ | 10.0 | √ | x |\n| duration | 5.0 | √ | √ | 10.0 | √ | x |\n| percent | 5.0 | √ | √ | 10.0 | √ | x |\n| show-info | 5.0 | √ | √ | 10.0 | √ | x |\n| border-radius | 5.0 | √ | √ | 10.0 | √ | x |\n| font-size | 5.0 | √ | √ | 10.0 | √ | x |\n| stroke-width | 5.0 | √ | √ | 10.0 | √ | x |\n| activeColor | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | √ | √ | 10.0 | √ | x |\n| active | 5.0 | √ | √ | 10.0 | √ | x |\n| active-mode | 5.0 | √ | √ | 10.0 | √ | x |\n| @activeend | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/progress)\n"},"radio":{"name":"## radio","description":"单选项。在1组radio-group中只能选中1个","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| disabled | Boolean | false | 是否禁用 |\n| value | String | - | \\<radio/> 标识。当该radio 选中时，radio-group的 change 事件会携带radio的value |\n| checked | Boolean | false | \\<radio/> 当前是否选中 |\n| color | ColorString | #007AFF | radio的颜色 |\n| backgroundColor | ColorString | #ffffff | radio默认的背景颜色 |\n| borderColor | ColorString | #d1d1d1 | radio默认的边框颜色 |\n| activeBackgroundColor | ColorString | #007AFF | radio选中时的背景颜色，优先级大于color属性 |\n| activeBorderColor | ColorString |  | radio选中时的边框颜色 |\n| iconColor | ColorString | #ffffff | radio的图标颜色 |","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/radio/radio.uvue) \n ```html\n<script>\r\ntype ItemType = {\r\n\tvalue : string\r\n\tname : string\r\n}\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\titems: [\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'CHN',\r\n\t\t\t\t\tname: '中国',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'USA',\r\n\t\t\t\t\tname: '美国',\r\n\t\t\t\t},\r\n\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'BRA',\r\n\t\t\t\t\tname: '巴西',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'JPN',\r\n\t\t\t\t\tname: '日本',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'ENG',\r\n\t\t\t\t\tname: '英国',\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tvalue: 'FRA',\r\n\t\t\t\t\tname: '法国',\r\n\t\t\t\t},\r\n\t\t\t] as ItemType[],\r\n\t\t\tcurrent: 0,\r\n\r\n\t\t\tvalue: '',\r\n\t\t\ttext: '未选中',\r\n\t\t\twrapText: 'uni-app x，终极跨平台方案\\nuts，大一统语言',\r\n\t\t\tdisabled: true,\r\n\t\t\tchecked: true,\r\n\t\t\tcolor: '#007aff',\r\n\t\t\t// 组件属性 autotest\r\n\t\t\tchecked_boolean: false,\r\n\t\t\tdisabled_boolean: false,\r\n\t\t\tcolor_input: \"#007AFF\",\r\n\t\t\tbackgroundColor_input: \"#ffffff\",\r\n\t\t\tborderColor_input: \"#d1d1d1\",\r\n\t\t\tactiveBackgroundColor_input: \"#007AFF\",\r\n\t\t\tactiveBorderColor_input: \"\",\r\n\t\t\ticonColor_input: \"#ffffff\"\r\n\t\t}\r\n\t},\r\n\tmethods: {\r\n\t\tradioChange(e : RadioGroupChangeEvent) {\r\n\t\t\tconst selected = this.items.find((item) : boolean => {\r\n\t\t\t\treturn item.value == e.detail.value\r\n\t\t\t})\r\n\t\t\tuni.showToast({\r\n\t\t\t\ticon: 'none',\r\n\t\t\t\ttitle: '当前选中:' + selected?.name,\r\n\t\t\t})\r\n\t\t},\r\n\t\ttestChange(e : RadioGroupChangeEvent) {\r\n\t\t\tthis.value = e.detail.value\r\n\t\t},\r\n\t\tradio_click() { console.log(\"组件被点击时触发\") },\r\n\t\tradio_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\tradio_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\tradio_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\tradio_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\tradio_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\tradio_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\tchange_checked_boolean(checked : boolean) { this.checked_boolean = checked },\r\n\t\tchange_disabled_boolean(checked : boolean) { this.disabled_boolean = checked },\r\n\t\tconfirm_color_input(value : string) { this.color_input = value },\r\n\t\tconfirm_backgroundColor_input(value : string) { this.backgroundColor_input = value },\r\n\t\tconfirm_borderColor_input(value : string) { this.borderColor_input = value },\r\n\t\tconfirm_activeBackgroundColor_input(value : string) { this.activeBackgroundColor_input = value },\r\n\t\tconfirm_activeBorderColor_input(value : string) { this.activeBorderColor_input = value },\r\n\t\tconfirm_iconColor_input(value : string) { this.iconColor_input = value }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <radio\r\n      :disabled=\"disabled_boolean\"\r\n      :checked=\"checked_boolean\"\r\n      :color=\"color_input\"\r\n      :backgroundColor=\"backgroundColor_input\"\r\n      :borderColor=\"borderColor_input\"\r\n      :activeBackgroundColor=\"activeBackgroundColor_input\"\r\n      :activeBorderColor=\"activeBorderColor_input\"\r\n      :iconColor=\"iconColor_input\"\r\n      @click=\"radio_click\"\r\n      @touchstart=\"radio_touchstart\"\r\n      @touchmove=\"radio_touchmove\"\r\n      @touchcancel=\"radio_touchcancel\"\r\n      @touchend=\"radio_touchend\"\r\n      @tap=\"radio_tap\"\r\n      @longpress=\"radio_longpress\"\r\n    >\r\n      <text>uni-app-x</text>\r\n    </radio>\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <page-head title=\"组件属性\"></page-head>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"<radio/> 当前是否选中\"\r\n        @change=\"change_checked_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否禁用\"\r\n        @change=\"change_disabled_boolean\"\r\n      ></boolean-data>\r\n      <input-data\r\n        defaultValue=\"#007AFF\"\r\n        title=\"radio的颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_color_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"radio默认的背景颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_backgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#d1d1d1\"\r\n        title=\"radio默认的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_borderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#007AFF\"\r\n        title=\"radio选中时的背景颜色，优先级大于color属性\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBackgroundColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"\"\r\n        title=\"radio选中时的边框颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_activeBorderColor_input\"\r\n      ></input-data>\r\n      <input-data\r\n        defaultValue=\"#ffffff\"\r\n        title=\"radio的图标颜色\"\r\n        type=\"text\"\r\n        @confirm=\"confirm_iconColor_input\"\r\n      ></input-data>\r\n    </view>\r\n\r\n    <view>\r\n      <page-head title=\"默认及使用\"></page-head>\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 默认样式 </text>\r\n        </view>\r\n        <radio-group\r\n          class=\"uni-flex uni-row radio-group\"\r\n          @change=\"testChange\"\r\n          style=\"flex-wrap: wrap\"\r\n        >\r\n          <radio\r\n            value=\"r\"\r\n            :checked=\"checked\"\r\n            :color=\"color\"\r\n            style=\"margin-right: 30rpx\"\r\n            class=\"radio r\"\r\n            >选中\r\n          </radio>\r\n          <radio value=\"r1\" style=\"margin-right: 30rpx\" class=\"radio r1\">{{\r\n            text\r\n          }}</radio>\r\n          <radio value=\"r2\" :disabled=\"disabled\" class=\"radio r2\">禁用</radio>\r\n          <radio value=\"r3\" class=\"radio r3\" style=\"margin-top: 20rpx\">{{\r\n            wrapText\r\n          }}</radio>\r\n        </radio-group>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 不同颜色和尺寸的radio </text>\r\n        </view>\r\n        <radio-group class=\"uni-flex uni-row radio-group\">\r\n          <radio\r\n            value=\"r1\"\r\n            :checked=\"true\"\r\n            color=\"#FFCC33\"\r\n            style=\"transform: scale(0.7); margin-right: 30rpx\"\r\n            class=\"radio\"\r\n            >选中\r\n          </radio>\r\n          <radio\r\n            value=\"r2\"\r\n            color=\"#FFCC33\"\r\n            style=\"transform: scale(0.7)\"\r\n            class=\"radio\"\r\n            >未选中</radio\r\n          >\r\n        </radio-group>\r\n      </view>\r\n\r\n      <view class=\"uni-padding-wrap\">\r\n        <view class=\"uni-title uni-common-mt\">\r\n          <text class=\"uni-title-text\"> 推荐展示样式 </text>\r\n        </view>\r\n      </view>\r\n      <view class=\"uni-list uni-common-pl\">\r\n        <radio-group @change=\"radioChange\" class=\"radio-group\">\r\n          <radio\r\n            class=\"uni-list-cell uni-list-cell-pd radio\"\r\n            v-for=\"(item, index) in items\"\r\n            :key=\"item.value\"\r\n            :class=\"index < items.length - 1 ? 'uni-list-cell-line' : ''\"\r\n            :value=\"item.value\"\r\n            :checked=\"index === current\"\r\n          >\r\n            {{ item.name }}\r\n          </radio>\r\n        </radio-group>\r\n      </view>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n\r\n.uni-list-cell {\r\n  justify-content: flex-start;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| radio | 5.0 | √ | √ | 10.0 | √ | x |\n| disabled | 5.0 | √ | √ | 10.0 | √ | x |\n| value | 5.0 | √ | √ | 10.0 | √ | x |\n| checked | 5.0 | √ | √ | 10.0 | √ | x |\n| color | 5.0 | √ | √ | 10.0 | √ | x |\n| backgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| borderColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBackgroundColor | 5.0 | x | √ | 10.0 | x | x |\n| activeBorderColor | 5.0 | x | √ | 10.0 | x | x |\n| iconColor | 5.0 | x | √ | 10.0 | x | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/radio)\n"},"radio-group":{"name":"## radio-group","description":"单选组，内部由多个 radio 组成","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| @change | (event: [RadioGroupChangeEvent](#radiogroupchangeevent)) => void | - | radio-group 中的选中项发生变化时触发 change 事件，event.detail = {value: 选中项radio的value} |","event":"\n### 事件\n#### RadioGroupChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### RadioGroupChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - | - |\n\n","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| radio-group | 5.0 | √ | √ | 10.0 | √ | x |\n| @change | 5.0 | √ | √ | 10.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [radio](#radio)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/radio)\n"},"rich-text":{"name":"## rich-text","description":"富文本。可渲染文字样式、图片、超链接。支持部分HTML标签","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| nodes | Array \\| String | - | 节点列表 \\| HTML String |\n| selectable | Boolean | false | 文本是否可选 |\n| @itemclick | (event: [RichTextItemClickEvent](#richtextitemclickevent)) => void | - | 拦截点击事件（只支持 a、img标签），返回用户自定义数据或img标签的src属性或a标签的href属性。event.detail={ ref \\| src \\| href } |","event":"\n### 事件\n#### RichTextItemClickEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RichTextItemClickEvent detail](#richtextitemclickevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RichTextItemClickEvent detail 属性值 @richtextitemclickevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| ref | string | 否 | - |  自定义数据 |\n| src | string | 否 | - |  \\<img/>图片链接 |\n| href | string | 否 | - |  \\<a/>超链接 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/rich-text/rich-text.uvue) \n ```html\n<template>\n  <view>\n    <page-head title=\"rich-text\"></page-head>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-btn-v\">\n        <navigator url=\"/pages/component/rich-text/rich-text-tags\">\n          <button type=\"primary\">rich-text渲染单个HTML标签示例</button>\n        </navigator>\n      </view>\n      <view class=\"uni-btn-v\">\n        <navigator url=\"/pages/component/rich-text/rich-text-complex\">\n          <button type=\"primary\">rich-text渲染复杂HTML示例</button>\n        </navigator>\n      </view>\n      <view class=\"uni-title\">\n        <text class=\"uni-subtitle-text\">selectable</text>\n      </view>\n      <view class=\"text-box\">\n        <rich-text :selectable=\"true\"\n          nodes=\"<span>hello uni-app x!</span><br/><span>uni-app x，终极跨平台方案</span>\"></rich-text>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n\n</script>\n\n<style>\n  .text-box {\n    padding: 40rpx 0;\n    background-color: white;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| rich-text | 5.0 | √ | 3.9 | 9.0 | √ | - |\n| selectable | 5.0 | x | 3.91 | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/rich-text)\n"},"scroll-view":{"name":"## scroll-view","description":"可滚动视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| scroll-x | Boolean | false | 允许横向滚动，不支持同时设置scroll-y属性为true，同时设置true时scroll-y生效 |\n| scroll-y | Boolean | true | 允许纵向滚动，不支持同时设置scroll-x属性为true，同时设置true时scroll-y生效 |\n| rebound | Boolean | true | 控制是否回弹效果 |\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 | - | 值应为某子元素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| refresher-background | String | #FFF | 设置下拉刷新区域背景颜色 |\n| refresher-triggered | Boolean | false | 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 |\n| show-scrollbar | Boolean | true | 控制是否出现滚动条 |\n| custom-nested-scroll | Boolean | false | 子元素是否开启嵌套滚动 将滚动事件与父元素协商处理 |\n| @refresherpulling | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新控件被下拉 |\n| @refresherrefresh | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被触发 |\n| @refresherrestore | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被复位 |\n| @refresherabort | (event: [RefresherEvent](#refresherevent)) => void | - | 下拉刷新被中止 |\n| @scrolltoupper | (event: [ScrollToUpperEvent](#scrolltoupperevent)) => void | - | 滚动到顶部/左边，会触发 scrolltoupper 事件 |\n| @scrolltolower | (event: [ScrollToLowerEvent](#scrolltolowerevent)) => void | - | 滚动到底部/右边，会触发 scrolltolower 事件 |\n| @scroll | (event: [ScrollEvent](#scrollevent)) => void | - | 滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} |\n| @startnestedscroll | (event: [StartNestedScrollEvent](#startnestedscrollevent)) => Boolean | - | 子元素开始滚动时触发, return ture表示与子元素开启滚动协商 默认return false! event = {node} |\n| @nestedprescroll | (event: [NestedPreScrollEvent](#nestedprescrollevent)) => void | - | 子元素滚动时触发，可执行event.consumed(x,y)告知子元素deltaX、deltaY各消耗多少。子元素将执行差值后的deltaX、deltaY滚动距离。不执行consumed(x,y)则表示父元素不消耗deltaX、deltaY。event = {deltaX, deltaY} |\n| @stopnestedscroll | (event: [Event](/uni-app-x/component/common#event)) => void | - | 子元素滚动结束或意外终止时触发 |","event":"\n### 事件\n#### RefresherEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [RefresherEvent detail](#refresherevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### RefresherEvent detail 属性值 @refresherevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToUpperEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToUpperEvent detail](#scrolltoupperevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToUpperEvent detail 属性值 @scrolltoupperevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 top 或 left |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollToLowerEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollToLowerEvent detail](#scrolltolowerevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollToLowerEvent detail 属性值 @scrolltolowerevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| direction | string | 是 | - |  滚动方向 bottom 或 right |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### ScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [ScrollEvent detail](#scrollevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### ScrollEvent detail 属性值 @scrollevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| scrollTop | number | 是 | - |  竖向滚动的距离 |\n| scrollLeft | number | 是 | - |  横向滚动的距离 |\n| scrollHeight | number | 是 | - |  滚动区域的高度 |\n| scrollWidth | number | 是 | - |  滚动区域的宽度 |\n| deltaY | number | 是 | - |  当次滚动事件竖向滚动量 |\n| deltaX | number | 是 | - |  当次滚动事件横向滚动量 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### StartNestedScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| node | [Element](/uni-app-x/dom/element.md) | 是 | - |  开始滚动子节点对象 |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### NestedPreScrollEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| deltaX | number | 是 | - |  x轴滚动距离 |\n| deltaY | number | 是 | - |  y轴滚动距离 |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| consumed | (consumedX: number, consumedY: number) => void | 是 | - |  通知到子节点x,y轴滚动距离的消耗 |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/scroll-view/scroll-view.uvue) \n ```html\n<template>\n\t<!-- #ifdef APP -->\n\t<scroll-view style=\"flex: 1\">\n\t\t<!-- #endif -->\n\t\t<view>\n\t\t\t<page-head title=\"scroll-view,区域滚动视图\"></page-head>\n\t\t\t<view class=\"uni-padding-wrap uni-common-mt\">\n\t\t\t\t<view class=\"uni-title uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-title-text\">Vertical Scroll</text>\n\t\t\t\t\t<text class=\"uni-subtitle-text\">纵向滚动</text>\n\t\t\t\t</view>\n\t\t\t\t<view>\n\t\t\t\t\t<scroll-view :scroll-top=\"scrollTop\" :scroll-y=\"true\" class=\"scroll-Y\" scroll-with-animation=\"true\"\n\t\t\t\t\t\t@scrolltoupper=\"upper\" @scrolltolower=\"lower\" @scroll=\"scroll\">\n\t\t\t\t\t\t<view id=\"demo1\" class=\"scroll-view-item uni-bg-red\"><text class=\"text\">A</text></view>\n\t\t\t\t\t\t<view id=\"demo2\" class=\"scroll-view-item uni-bg-green\"><text class=\"text\">B</text></view>\n\t\t\t\t\t\t<view id=\"demo3\" class=\"scroll-view-item uni-bg-blue\"><text class=\"text\">C</text></view>\n\t\t\t\t\t</scroll-view>\n\t\t\t\t</view>\n\t\t\t\t<view @tap=\"goTop\" class=\"uni-center uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-link\">点击这里返回顶部</text>\n\t\t\t\t</view>\n\n\t\t\t\t<view class=\"uni-title uni-common-mt\">\n\t\t\t\t\t<text class=\"uni-title-text\">Horizontal Scroll</text>\n\t\t\t\t\t<text class=\"uni-subtitle-text\">横向滚动</text>\n\t\t\t\t</view>\n\t\t\t\t<view>\n\t\t\t\t\t<scroll-view class=\"scroll-view_H\" :scroll-x=\"true\" @scroll=\"scroll\" :scroll-left=\"120\">\n\t\t\t\t\t\t<view id=\"demo1\" class=\"scroll-view-item_H uni-bg-red\"><text class=\"text\">A</text></view>\n\t\t\t\t\t\t<view id=\"demo2\" class=\"scroll-view-item_H uni-bg-green\"><text class=\"text\">B</text></view>\n\t\t\t\t\t\t<view id=\"demo3\" class=\"scroll-view-item_H uni-bg-blue\"><text class=\"text\">C</text></view>\n\t\t\t\t\t</scroll-view>\n\t\t\t\t</view>\n\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t非下拉刷新的属性示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-refresher-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t下拉刷新的属性示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-refresher\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\"> 默认下拉刷新示例 </button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t\t<navigator url=\"/pages/component/scroll-view/scroll-view-custom-refresher-props\" hover-class=\"none\">\n\t\t\t\t<button type=\"primary\" class=\"button default-button\">\n\t\t\t\t\t自定义下拉刷新示例\n\t\t\t\t</button>\n\t\t\t\t</navigator>\n\t\t\t\t<view class=\"uni-common-pb\"></view>\n\t\t\t</view>\n\t\t</view>\n\t\t<!-- #ifdef APP -->\n\t</scroll-view>\n\t<!-- #endif -->\n</template>\n<script lang=\"uts\">\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tscrollTop: 0,\n\t\t\t\toldScrollTop: 0,\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tupper: function (e : ScrollToUpperEvent) {\n\t\t\t\tconsole.log(e)\n\t\t\t},\n\t\t\tlower: function (e : ScrollToLowerEvent) {\n\t\t\t\tconsole.log(e)\n\t\t\t},\n\t\t\tscroll: function (e : ScrollEvent) {\n\t\t\t\tthis.oldScrollTop = e.detail.scrollTop\n\t\t\t},\n\t\t\tgoTop: function () {\n\t\t\t\t// 解决view层不同步的问题\n\t\t\t\tthis.scrollTop = this.oldScrollTop\n\t\t\t\tthis.$nextTick(function () {\n\t\t\t\t\tthis.scrollTop = 0\n\t\t\t\t})\n\t\t\t\tuni.showToast({\n\t\t\t\t\ticon: 'none',\n\t\t\t\t\ttitle: '纵向滚动 scrollTop 值已被修改为 0',\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t}\n</script>\n\n<style>\n\t.scroll-Y {\n\t\theight: 300rpx;\n\t}\n\n\t.scroll-view_H {\n\t\twidth: 100%;\n\t\tflex-direction: row;\n\t}\n\n\t.scroll-view-item {\n\t\theight: 300rpx;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.scroll-view-item_H {\n\t\twidth: 690rpx;\n\t\theight: 300rpx;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.text {\n\t\tfont-size: 36rpx;\n\t\tcolor: #ffffff;\n\t}\n\n\t.button {\n\t\tmargin-top: 30rpx;\n\t}\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| scroll-view | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| scroll-x | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-y | 5.0 | √ | 3.9+ | - | - | - |\n| rebound | 5.0 | x | 3.9+ | - | - | - |\n| upper-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| lower-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-top | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-left | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-into-view | 5.0 | √ | 3.9+ | - | - | - |\n| scroll-with-animation | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-enabled | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-threshold | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-max-drag-distance | 5.0 | x | 3.9+ | - | - | - |\n| refresher-default-style | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-background | 5.0 | √ | 3.9+ | - | - | - |\n| refresher-triggered | 5.0 | √ | 3.9+ | - | - | - |\n| show-scrollbar | 5.0 | √ | 3.9+ | - | - | - |\n| custom-nested-scroll | 5.0 | x | 3.9+ | 9.0 | √ | - |\n| @refresherpulling | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherrefresh | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherrestore | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @refresherabort | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scrolltoupper | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scrolltolower | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @scroll | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @startnestedscroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @nestedprescroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n| @stopnestedscroll | 5.0 | x | 3.9+ | 9.0 | x | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/scroll-view)\n"},"slider":{"name":"## slider","description":"滑动选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\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| color | ColorString | - | slider 背景条的颜色（请使用 backgroundColor） |\n| activeColor | ColorString | #007aff | slider 滑块左侧已选择部分的线条颜色 |\n| backgroundColor | ColorString | #e9e9e9 | radio背景条的颜色 |\n| block-size | Number | 28 | radio滑块的大小，取值范围为 12 - 28 |\n| block-color | ColorString | #ffffff | 滑块颜色 |\n| show-value | Boolean | false | 是否显示当前 value |\n| @change | (event: [SliderChangeEvent](#sliderchangeevent)) => void | - | 完成一次拖动后触发的事件，event.detail = {value: value} |\n| @changing | (event: [SliderChangeEvent](#sliderchangeevent)) => void | - | 拖动过程中触发的事件，event.detail = {value: value} |","event":"\n### 事件\n#### SliderChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SliderChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | number | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/slider/slider.uvue) \n ```html\n<script>\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      };\n    },\n    methods: {\n      sliderChange(e : SliderChangeEvent) {\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    },\n  };\n</script>\n\n<template>\n  <view class=\"main\">\n    <slider :disabled=\"disabled_boolean\" :min=\"min_input\" :max=\"max_input\" :step=\"step_input\" :value=\"value_input\"\n      :activeColor=\"activeColor_input\" :backgroundColor=\"backgroundColor_input\" :block-size=\"block_size_input\"\n      :block-color=\"block_color_input\" :show-value=\"show_value_boolean\" @click=\"slider_click\"\n      @touchstart=\"slider_touchstart\" @touchmove=\"slider_touchmove\" @touchcancel=\"slider_touchcancel\"\n      @touchend=\"slider_touchend\" @tap=\"slider_tap\" @longpress=\"slider_longpress\" @change=\"slider_change\"\n      @changing=\"slider_changing\" style=\"width: 90%\"><text>uni-app-x</text></slider>\n  </view>\n\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n  <!-- #endif -->\n    <view class=\"content nvue\">\n      <page-head title=\"组件属性\"></page-head>\n      <boolean-data :defaultValue=\"false\" title=\"是否显示当前 value\" @change=\"change_show_value_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否禁用\" @change=\"change_disabled_boolean\"></boolean-data>\n      <input-data defaultValue=\"0\" title=\"slider 最小值\" type=\"number\" @confirm=\"confirm_min_input\"></input-data>\n      <input-data defaultValue=\"100\" title=\"slider 最大值\" type=\"number\" @confirm=\"confirm_max_input\"></input-data>\n      <input-data defaultValue=\"1\" title=\"slider 步长，取值必须大于 0，并且可被(max - min)整除\" type=\"number\"\n        @confirm=\"confirm_step_input\"></input-data>\n      <input-data defaultValue=\"0\" title=\"radio当前取值\" type=\"number\" @confirm=\"confirm_value_input\"></input-data>\n      <input-data defaultValue=\"#007aff\" title=\"slider 滑块左侧已选择部分的线条颜色\" type=\"text\"\n        @confirm=\"confirm_activeColor_input\"></input-data>\n      <input-data defaultValue=\"#e9e9e9\" title=\"radio背景条的颜色\" type=\"text\"\n        @confirm=\"confirm_backgroundColor_input\"></input-data>\n      <input-data defaultValue=\"28\" title=\"radio滑块的大小，取值范围为 12 - 28\" type=\"number\"\n        @confirm=\"confirm_block_size_input\"></input-data>\n      <input-data defaultValue=\"#ffffff\" title=\"滑块颜色\" type=\"text\" @confirm=\"confirm_block_color_input\"></input-data>\n    </view>\n\n    <view class=\"uni-padding-wrap\">\n      <page-head title=\"默认及使用\"></page-head>\n      <view class=\"uni-title\">显示当前value</view>\n      <view>\n        <slider @change=\"sliderChange\" :value=\"50\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">设置步进:step=10跳动</view>\n      <view>\n        <view class=\"uni-row\">\n          <text>0</text>\n          <text class=\"m-l-a\">100</text>\n        </view>\n        <slider @change=\"sliderChange\" :value=\"60\" :step=\"10\" />\n      </view>\n\n      <view class=\"uni-title\">浮点步进:step=0.01跳动</view>\n      <view>\n        <slider :value=\"0.5\" :min=\"0\" :max=\"1\" :step=\"0.01\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">设置最小/最大值</view>\n      <view>\n        <slider @change=\"sliderChange\" :value=\"100\" :min=\"50\" :max=\"200\" :show-value=\"true\" />\n      </view>\n\n      <view class=\"uni-title\">不同颜色和大小的滑块</view>\n      <view>\n        <slider class=\"slider-custom-color-and-size\" @change=\"sliderChange\" :value=\"sliderValue\"\n          :backgroundColor=\"sliderBackgroundColor\" :activeColor=\"sliderActiveColor\" :blockColor=\"sliderBlockColor\"\n          :block-size=\"sliderBlockSize\" />\n      </view>\n    </view>\n  <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<style>\n  .main {\n    max-height: 500rpx;\n    padding: 10rpx 0;\n    border-bottom: 1px solid rgba(0, 0, 0, 0.06);\n    flex-direction: row;\n    justify-content: center;\n  }\n\n  .main .list-item {\n    width: 100%;\n    height: 200rpx;\n    border: 1px solid #666;\n  }\n\n  .m-l-a {\n    margin-left: auto;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| slider | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| disabled | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| min | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| max | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| step | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| value | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| activeColor | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| backgroundColor | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| block-size | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| block-color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| show-value | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @changing | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/slider)\n"},"swiper-item":{"name":"## swiper-item","description":"swiper的唯一合法子组件。每个swiper-item代表一个滑块。宽高自动设置为100%","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| item-id | String | - | 该 swiper-item 的标识符 |","event":"","example":"","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| swiper-item | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| item-id | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.net.cn/component/swiper.html#swiper-item)\n"},"swiper":{"name":"## swiper","description":"滑块视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| indicator-dots | Boolean | false | 是否显示面板指示点 |\n| indicator-color | ColorString | rgba(0, 0, 0, .3) | 指示点颜色 |\n| indicator-active-color | ColorString | #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| circular | Boolean | false | 是否采用衔接滑动 |\n| vertical | Boolean | false | 滑动方向是否为纵向 |\n| @change | (event: [SwiperChangeEvent](#swiperchangeevent)) => void | - | current 改变时会触发 change 事件，event.detail = {current: current, source: source} |\n| @transition | (event: [SwiperTransitionEvent](#swipertransitionevent)) => void | - | swiper-item 的位置发生改变时会触发 transition 事件，event.detail = {dx: dx, dy: dy} |\n| @animationfinish | (event: [SwiperAnimationFinishEvent](#swiperanimationfinishevent)) => void | - | 动画结束时会触发 animationfinish 事件，event.detail = {current: current, source: source} |","event":"\n### 事件\n#### SwiperChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperChangeEvent detail](#swiperchangeevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperChangeEvent detail 属性值 @swiperchangeevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| current | number | 是 | - | - |\n| source | string | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwiperTransitionEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperTransitionEvent detail](#swipertransitionevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperTransitionEvent detail 属性值 @swipertransitionevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| dx | number | 是 | - | - |\n| dy | number | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwiperAnimationFinishEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [SwiperAnimationFinishEvent detail](#swiperanimationfinishevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### SwiperAnimationFinishEvent detail 属性值 @swiperanimationfinishevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| current | number | 是 | - | - |\n| source | string | 是 | - | - |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/swiper/swiper.uvue) \n ```html\n<template>\r\n\t<!-- #ifdef APP -->\r\n\t<scroll-view style=\"flex: 1\">\r\n\t\t<!-- #endif -->\r\n\t\t<view>\r\n\t\t\t<page-head title=\"swiper,可滑动视图\"></page-head>\r\n\t\t\t<view class=\"uni-margin-wrap\">\r\n\t\t\t\t<swiper class=\"swiper\" :vertical=\"verticalSelect\" :indicator-dots=\"dotsSelect\" :autoplay=\"autoplaySelect\"\n          :rebound=\"reboundSelect\"\r\n\t\t\t\t\t:interval=\"intervalSelect\" :circular=\"circularSelect\" :indicator-color=\"indicatorColor\"\r\n\t\t\t\t\t:indicator-active-color=\"indicatorColorActive\" :disable-touch=\"disableTouchSelect\" :current=\"currentVal\"\r\n\t\t\t\t\t:current-item-id=\"currentItemIdVal\" @change=\"swiperChange\" @transition=\"swiperTransition\"\r\n\t\t\t\t\t@animationfinish=\"swiperAnimationfinish\">\r\n\t\t\t\t\t<swiper-item item-id=\"A\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-red\"><text class=\"swiper-item-Text\">A</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t\t<swiper-item item-id=\"B\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-green\"><text class=\"swiper-item-Text\">B</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t\t<swiper-item item-id=\"C\">\r\n\t\t\t\t\t\t<view class=\"swiper-item uni-bg-blue\"><text class=\"swiper-item-Text\">C</text></view>\r\n\t\t\t\t\t</swiper-item>\r\n\t\t\t\t</swiper>\r\n\t\t\t</view>\r\n\t\t\t<view class=\"uni-list\">\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否显示面板指示点</view>\r\n\t\t\t\t\t<switch :checked=\"dotsSelect\" @change=\"dotsChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否自动切换</view>\r\n\t\t\t\t\t<switch :checked=\"autoplaySelect\" @change=\"autoplayChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">是否循环</view>\r\n\t\t\t\t\t<switch :checked=\"circularSelect\" @change=\"circularChange\" />\r\n\t\t\t\t</view>\n        <view class=\"uni-list-cell uni-list-cell-pd\">\n        \t<view class=\"uni-list-cell-db\">是否显示rebound效果</view>\n        \t<switch :checked=\"reboundSelect\" @change=\"reboundSelectChange\" />\n        </view>\r\n\t\t\t\t<view class=\"uni-title\">间隔时间(毫秒)</view>\r\n\t\t\t\t<view>\r\n\t\t\t\t\t<slider @change=\"sliderChange\" :value=\"1000\" :min=\"500\" :max=\"5000\" :show-value=\"true\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">定制指示器颜色</view>\r\n\t\t\t\t\t<switch :checked=\"indicatorColorSelect\" @change=\"indicatorColorChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">纵向</view>\r\n\t\t\t\t\t<switch :checked=\"verticalSelect\" @change=\"verticalChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">指定current为最后一个元素</view>\r\n\t\t\t\t\t<switch :checked=\"currentSelect\" @change=\"currentChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">指定current-item-id为最后一个元素</view>\r\n\t\t\t\t\t<switch :checked=\"currentItemIdSelect\" @change=\"currentItemIdChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">禁止用户 touch 操作</view>\r\n\t\t\t\t\t<switch :checked=\"disableTouchSelect\" @change=\"disableTouchChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperTransition 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperTransitionSelect\" @change=\"swiperTransitionChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperAnimationfinish 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperAnimationfinishSelect\" @change=\"swiperAnimationfinishChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<view class=\"uni-list-cell uni-list-cell-pd\">\r\n\t\t\t\t\t<view class=\"uni-list-cell-db\">swiperChange 是否打印</view>\r\n\t\t\t\t\t<switch :checked=\"swiperChangeSelect\" @change=\"swiperChangeChange\" />\r\n\t\t\t\t</view>\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t\t<!-- #ifdef APP -->\r\n\t</scroll-view>\r\n\t<!-- #endif -->\r\n</template>\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\tbackground: ['color1', 'color2', 'color3'],\r\n\t\t\t\tdotsSelect: false,\n        reboundSelect:false,\r\n\t\t\t\tautoplaySelect: false,\r\n\t\t\t\tcircularSelect: false,\r\n\t\t\t\tindicatorColorSelect: false,\r\n\t\t\t\tverticalSelect: false,\r\n\t\t\t\tcurrentSelect: false,\r\n\t\t\t\tcurrentItemIdSelect: false,\r\n\t\t\t\tintervalSelect: 2000,\r\n\t\t\t\tindicatorColor: \"\",\r\n\t\t\t\tindicatorColorActive: \"\",\r\n\t\t\t\tcurrentVal: 0,\r\n\t\t\t\tcurrentItemIdVal: \"\",\r\n\t\t\t\tdisableTouchSelect: false,\r\n\t\t\t\tswiperTransitionSelect: false,\r\n\t\t\t\tswiperAnimationfinishSelect: false,\r\n\t\t\t\tswiperChangeSelect: false,\n        currentValChange:0\r\n\t\t\t}\r\n\t\t},\n\t\tmethods: {\r\n\r\n\t\t\tswiperChange: function (e : SwiperChangeEvent) {\n        this.currentValChange = e.detail.current\n        console.log(this.currentValChange)\n\t\t\t\tif (this.swiperChangeSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperChange\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tswiperTransition: function (e : SwiperTransitionEvent) {\r\n\t\t\t\tif (this.swiperTransitionSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperTransition\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tswiperAnimationfinish: function (e : SwiperAnimationFinishEvent) {\r\n\t\t\t\tif (this.swiperAnimationfinishSelect) {\r\n\t\t\t\t\tconsole.log(\"swiperAnimationfinish\")\r\n\t\t\t\t\tconsole.log(e)\r\n\t\t\t\t}\r\n\t\t\t},\r\n\r\n\t\t\tdotsChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.dotsSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperTransitionChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperTransitionSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperChangeChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperChangeSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tswiperAnimationfinishChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.swiperAnimationfinishSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tautoplayChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.autoplaySelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tverticalChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.verticalSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tdisableTouchChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.disableTouchSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tcurrentItemIdChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.currentItemIdSelect = e.detail.value\r\n\t\t\t\tif (this.currentItemIdSelect) {\r\n\t\t\t\t\tthis.currentItemIdVal = 'C'\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.currentItemIdVal = 'A'\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\tcurrentChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.currentSelect = e.detail.value\r\n\t\t\t\tif (this.currentSelect) {\r\n\t\t\t\t\tthis.currentVal = 2\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.currentVal = 0\r\n\t\t\t\t}\r\n\r\n\t\t\t},\r\n\t\t\tcircularChange: function (e : SwitchChangeEvent) {\r\n\t\t\t\tthis.circularSelect = e.detail.value\r\n\t\t\t\tconsole.log(this.circularSelect)\r\n\t\t\t},\n      reboundSelectChange: function (e : SwitchChangeEvent) {\n      \tthis.reboundSelect = e.detail.value\n      \tconsole.log(this.reboundSelect)\n      },\r\n\t\t\tsliderChange(e : SliderChangeEvent) {\r\n\t\t\t\tthis.intervalSelect = e.detail.value\r\n\t\t\t},\r\n\t\t\tindicatorColorChange(e : SwitchChangeEvent) {\r\n\t\t\t\tthis.indicatorColorSelect = e.detail.value\r\n\t\t\t\tif (this.indicatorColorSelect) {\r\n\t\t\t\t\t// 选择了定制指示器颜色\r\n\t\t\t\t\tthis.indicatorColor = \"#ff00ff\"\r\n\t\t\t\t\tthis.indicatorColorActive = \"#0000ff\"\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// 没有选择颜色\r\n\t\t\t\t\tthis.indicatorColor = \"\"\r\n\t\t\t\t\tthis.indicatorColorActive = \"\"\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n</script>\r\n\r\n<style>\r\n\t.uni-margin-wrap {\r\n\t\twidth: 690rpx;\r\n\t\twidth: 100%;\r\n\t\t;\r\n\t}\r\n\r\n\t.swiper {\r\n\t\theight: 300rpx;\r\n\t}\r\n\r\n\t.swiper-item {\r\n\t\twidth: 100%;\r\n\t\theight: 300rpx;\r\n\t}\r\n\r\n\t.swiper-item-Text {\r\n\t\twidth: 100%;\r\n\t\ttext-align: center;\r\n\t\tline-height: 300rpx;\r\n\t}\r\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| swiper | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| indicator-dots | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| indicator-color | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| indicator-active-color | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| disable-touch | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| autoplay | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| current | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| current-item-id | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| interval | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| circular | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| vertical | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| @transition | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n| @animationfinish | 5.0 | √ | 3.9.0 | 9.0 | √ | x |\n","children":"### 子组件 @children-tags \n - [swiper-item](#swiper-item)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/swiper)\n"},"switch":{"name":"## switch","description":"开关选择器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| checked | Boolean | - | 是否选中 |\n| color | ColorString | - | switch 的颜色，同 css 的 color |\n| disabled | Boolean | - | 是否禁用 |\n| @change | (event: [SwitchChangeEvent](#switchchangeevent)) => void | - | checked 改变时触发 change 事件，event.detail={ value:checked} |","event":"\n### 事件\n#### SwitchChangeEvent\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | T | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### SwitchChangeEventDetail\n\n##### 构造函数\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | boolean | 是 | - | - |\n\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/switch/switch.uvue) \n ```html\n<template>\n  <view class=\"uni-padding-wrap\">\n    <view class=\"uni-common-mt\">\n      <view class=\"uni-title\">默认样式</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-checked\" :checked=\"checked\" @change=\"switch1Change\" />\n        <switch @change=\"switch2Change\" />\n        <!-- <text class=\"switch-checked-value\">{{clickCheckedValue}}</text> -->\n      </view>\n      <view class=\"uni-title\">禁用样式</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-checked\" :checked=\"checked\" :disabled=\"true\" />\n        <switch :disabled=\"true\" />\n      </view>\n      <view class=\"uni-title\">不同颜色和尺寸的switch</view>\n      <view class=\"flex-row\">\n        <switch class=\"switch-color-checked\" :color=\"color\" style=\"transform:scale(0.7)\" :checked=\"true\" />\n        <switch class=\"switch-color\" :color=\"color\" style=\"transform:scale(0.7)\" />\n      </view>\n      <view class=\"uni-title\">推荐展示样式</view>\n    </view>\n    <view class=\"uni-list\">\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">开启中</view>\n        <switch :checked=\"true\" />\n      </view>\n      <view class=\"uni-list-cell uni-list-cell-pd\">\n        <view class=\"uni-list-cell-db\">关闭</view>\n        <switch />\n      </view>\n    </view>\n  </view>\n</template>\n\n<script lang=\"uts\">\n  export default {\n    data() {\n      return {\n        title: 'switch 开关',\n        checked: true,\n        color: '#FFCC33',\n        clickCheckedValue: true\n      }\n    },\n    methods: {\n      switch1Change: function (e : SwitchChangeEvent) {\n        this.clickCheckedValue = e.detail.value\n        console.log('switch1 发生 change 事件，携带值为', e.detail.value)\n      },\n      switch2Change: function (e : SwitchChangeEvent) {\n        console.log('switch2 发生 change 事件，携带值为', e.detail.value)\n      }\n    }\n  }\n</script>\n\n<style>\n  .flex-row {\n    flex-direction: row;\n  }\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| switch | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| checked | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| color | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| disabled | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n| @change | 5.0 | √ | 3.9+ | 9.0 | √ | x |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/switch)\n"},"text":{"name":"## text","description":"文本","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| selectable | Boolean | false | 文本是否可选 |\n| space | String | - | 显示连续空格 [space](#space-values) |\n| decode | Boolean | false | 是否解码 |\n\n#### space @space-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| ensp | 中文字符空格一半大小 |\n| emsp | 中文字符空格大小 |\n| nbsp | 根据字体设置的空格大小 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/text/text.uvue) \n ```html\n<template>\r\n    <view>\r\n        <page-head :title=\"title\"></page-head>\r\n        <view class=\"uni-padding-wrap uni-common-mt\">\r\n            <view class=\"text-box\" scroll-y=\"true\">\r\n                <text class=\"text\">{{text}}</text>\r\n            </view>\r\n            <view class=\"uni-btn-v\">\r\n                <button class=\"uni-btn\" type=\"primary\" :disabled=\"!canAdd\" @click=\"add\">add line</button>\r\n                <button class=\"uni-btn\" type=\"warn\" :disabled=\"!canRemove\" @click=\"remove\">remove line</button>\n\t\t\t\t<button class=\"uni-btn\" type=\"primary\" @click=\"textProps\">更多属性示例</button>\r\n            </view>\r\n        </view>\r\n    </view>\r\n</template>\r\n<script lang=\"uts\">\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\t\t\t\t\t'uts，大一统语言',\r\n\t\t\t\t\t'uniMPSdk，让你的App具备小程序能力',\r\n\t\t\t\t\t'uni-admin，开源、现成的全端管理后台',\r\n\t\t\t\t\t'uni-id，开源、全端的账户中心',\r\n\t\t\t\t\t'uni-pay，开源、云端一体、全平台的支付',\r\n\t\t\t\t\t'uni-ai，聚合ai能力',\r\n\t\t\t\t\t'uni-cms，开源、云端一体、全平台的内容管理平台',\r\n\t\t\t\t\t'uni-im，开源、云端一体、全平台的im即时消息',\r\n\t\t\t\t\t'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            },\n\t\t\ttextProps: function () {\n\t\t\t    uni.navigateTo({\n\t\t\t    \turl: '/pages/component/text/text-props'\n\t\t\t    })\n\t\t\t}\r\n        }\r\n    }\r\n</script>\r\n\r\n<style>\r\n    .text-box {\r\n        margin-bottom: 40rpx;\r\n        padding: 40rpx 0;\r\n        display: flex;\r\n        min-height: 300rpx;\r\n        background-color: #FFFFFF;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n\r\n    .text {\r\n        font-size: 30rpx;\r\n        color: #353535;\r\n        line-height: 54rpx;\n        text-align: center;\r\n    }\r\n</style>\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| text | 5.0 | √ | 3.9.0 | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n - [text](#text)","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/text)\n"},"textarea":{"name":"## textarea","description":"多行输入框","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| value | String |  | 输入框的初始内容 |\n| placeholder | String |  | 输入框为空时占位符 |\n| placeholder-style | String |  | 指定 placeholder 的样式 |\n| placeholder-class | String |  | 指定 placeholder 的样式类 |\n| maxlength | Number | 140 | 最大输入长度，设置为 -1 的时候不限制最大长度 |\n| auto-focus | Boolean | false | 自动获取焦点 |\n| focus | Boolean | false | 获取焦点 |\n| cursor | Number | 0 | 指定focus时的光标位置 |\n| confirm-type | String | done | 设置键盘右下角按钮的文字 [confirm-type](#confirm-type-values) |\n| confirm-hold | Boolean | false | 点击键盘右下角按钮时是否保持键盘不收起 |\n| auto-height | Boolean | false | 是否自动增高，设置auto-height时，style.height不生效 |\n| cursor-spacing | Number | 0 | 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 |\n| selection-start | Number | -1 | 光标起始位置，自动聚集时有效，需与selection-end搭配使用 |\n| selection-end | Number | -1 | 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 |\n| adjust-position | Boolean | true | 键盘弹起时，是否自动上推页面 |\n| @confirm | (event: [InputConfirmEvent](#inputconfirmevent)) => void | - | 点击完成时， 触发 confirm 事件，event.detail = {value: value} |\n| @input | (event: [InputEvent](#inputevent)) => void | - | 当键盘输入时，触发 input 事件，event.detail = {value, cursor}， @input 处理函数的返回值并不会反映到 textarea 上 |\n| @linechange | (event: [TextareaLineChangeEvent](#textarealinechangeevent)) => void | - | 输入框行数变化时调用，event.detail = {height: 0, heightRpx: 0, lineCount: 0} |\n| @blur | (event: [TextareaBlurEvent](#textareablurevent)) => void | - | 输入框失去焦点时触发，event.detail = {value, cursor} |\n| @keyboardheightchange | (event: [InputKeyboardHeightChangeEvent](#inputkeyboardheightchangeevent)) => void | - | 键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration} |\n| @focus | (event: [TextareaFocusEvent](#textareafocusevent)) => void | - | 输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持 |\n\n#### confirm-type @confirm-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| send | 发送 |\n| search | 搜索 |\n| next | 下一个 |\n| go | 前往 |\n| done | 完成 |\n\n","event":"\n### 事件\n#### InputConfirmEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputConfirmEvent detail](#inputconfirmevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputConfirmEvent detail 属性值 @inputconfirmevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputEvent detail](#inputevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputEvent detail 属性值 @inputevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  光标的位置 |\n| keyCode | number | 是 | - |  输入字符的Unicode值 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaLineChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaLineChangeEvent detail](#textarealinechangeevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaLineChangeEvent detail 属性值 @textarealinechangeevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| lineCount | number | 是 | - |  行数 |\n| heightRpx | number | 是 | - |  textarea的高度 |\n| height | number | 是 | - |  textarea的高度 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaBlurEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaBlurEvent detail](#textareablurevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaBlurEvent detail 属性值 @textareablurevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| value | string | 是 | - |  输入框内容 |\n| cursor | number | 是 | - |  选择区域的起始位置 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### InputKeyboardHeightChangeEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [InputKeyboardHeightChangeEvent detail](#inputkeyboardheightchangeevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### InputKeyboardHeightChangeEvent detail 属性值 @inputkeyboardheightchangeevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| duration | number | 是 | - |  持续时间 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### TextareaFocusEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [TextareaFocusEvent detail](#textareafocusevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### TextareaFocusEvent detail 属性值 @textareafocusevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| height | number | 是 | - |  键盘高度 |\n| value | string | 是 | - |  输入框内容 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/textarea/textarea.uvue) \n ```html\n<script>\r\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\tadjust_position_boolean: false,\r\n\t\t\tshow_confirm_bar_boolean: false,\r\n\t\t\tfixed_boolean: false,\r\n\t\t\tauto_height_boolean: false,\r\n\t\t\tconfirm_hold_boolean: false,\r\n\t\t\tfocus_boolean: false,\r\n\t\t\tauto_focus_boolean: false,\n      default_value:\"\",\n      maxlength:-1,\r\n\t\t\tconfirm_type_enum: [{\"value\":0,\"name\":\"send\"},{\"value\":1,\"name\":\"search\"},{\"value\":2,\"name\":\"next\"},{\"value\":3,\"name\":\"go\"},{\"value\":4,\"name\":\"done\"}] as ItemType[],\r\n\t\t\tconfirm_type_enum_current: 0,\r\n\t\t\tinputmode_enum: [{\"value\":0,\"name\":\"none\"},{\"value\":1,\"name\":\"text\"},{\"value\":2,\"name\":\"decimal\"},{\"value\":3,\"name\":\"numeric\"},{\"value\":4,\"name\":\"tel\"},{\"value\":5,\"name\":\"search\"},{\"value\":6,\"name\":\"email\"},{\"value\":7,\"name\":\"url\"}] as ItemType[],\r\n\t\t\tinputmode_enum_current: 0\r\n\t\t}\r\n\t},\n\r\n\tmethods: {\r\n\t\ttextarea_click() { console.log(\"组件被点击时触发\") },\r\n\t\ttextarea_touchstart() { console.log(\"手指触摸动作开始\") },\r\n\t\ttextarea_touchmove() { console.log(\"手指触摸后移动\") },\r\n\t\ttextarea_touchcancel() { console.log(\"手指触摸动作被打断，如来电提醒，弹窗\") },\r\n\t\ttextarea_touchend() { console.log(\"手指触摸动作结束\") },\r\n\t\ttextarea_tap() { console.log(\"手指触摸后马上离开\") },\r\n\t\ttextarea_longpress() { console.log(\"如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。\") },\r\n\t\ttextarea_confirm() { console.log(\"点击完成时， 触发 confirm 事件，event.detail = {value: value}\") },\r\n\t\ttextarea_input() { console.log(\"当键盘输入时，触发 input 事件，event.detail = {value, cursor}， @input 处理函数的返回值并不会反映到 textarea 上\") },\r\n\t\ttextarea_linechange() { console.log(\"输入框行数变化时调用，event.detail = {height: 0, heightRpx: 0, lineCount: 0}\") },\r\n\t\ttextarea_blur() { console.log(\"输入框失去焦点时触发，event.detail = {value, cursor}\") },\r\n\t\ttextarea_keyboardheightchange() { console.log(\"键盘高度发生变化的时候触发此事件，event.detail = {height: height, duration: duration}\") },\r\n\t\ttextarea_focus() { console.log(\"输入框聚焦时触发，event.detail = { value, height }，height 为键盘高度，在基础库 1.9.90 起支持\") },\r\n\t\tchange_adjust_position_boolean(checked : boolean) { this.adjust_position_boolean = checked },\r\n\t\tchange_show_confirm_bar_boolean(checked : boolean) { this.show_confirm_bar_boolean = checked },\r\n\t\tchange_fixed_boolean(checked : boolean) { this.fixed_boolean = checked },\r\n\t\tchange_auto_height_boolean(checked : boolean) { this.auto_height_boolean = checked },\r\n\t\tchange_confirm_hold_boolean(checked : boolean) { this.confirm_hold_boolean = checked },\r\n\t\tchange_focus_boolean(checked : boolean) { this.focus_boolean = checked },\r\n\t\tchange_auto_focus_boolean(checked : boolean) { this.auto_focus_boolean = checked },\r\n\t\tradio_change_confirm_type_enum(checked : number) { this.confirm_type_enum_current = checked },\r\n\t\tradio_change_inputmode_enum(checked : number) { this.inputmode_enum_current = checked }\r\n\t}\r\n}\r\n</script>\r\n\r\n<template>\r\n  <view class=\"main\">\r\n    <textarea\n    :value=\"default_value\"\r\n      class=\"uni-textarea\"\r\n      :auto-focus=\"auto_focus_boolean\"\r\n      :focus=\"focus_boolean\"\r\n      :confirm-type=\"confirm_type_enum[confirm_type_enum_current].name\"\r\n      :confirm-hold=\"confirm_hold_boolean\"\r\n      :auto-height=\"auto_height_boolean\"\r\n      :fixed=\"fixed_boolean\"\r\n      :show-confirm-bar=\"show_confirm_bar_boolean\"\r\n      :adjust-position=\"adjust_position_boolean\"\r\n      :inputmode=\"inputmode_enum[inputmode_enum_current].name\"\n      :maxlength=\"maxlength\"\r\n      @click=\"textarea_click\"\r\n      @touchstart=\"textarea_touchstart\"\r\n      @touchmove=\"textarea_touchmove\"\r\n      @touchcancel=\"textarea_touchcancel\"\r\n      @touchend=\"textarea_touchend\"\r\n      @tap=\"textarea_tap\"\r\n      @longpress=\"textarea_longpress\"\r\n      @confirm=\"textarea_confirm\"\r\n      @input=\"textarea_input\"\r\n      @linechange=\"textarea_linechange\"\r\n      @blur=\"textarea_blur\"\r\n      @keyboardheightchange=\"textarea_keyboardheightchange\"\r\n      @focus=\"textarea_focus\"\r\n      style=\"padding: 20rpx; border: 1px solid #666\"\r\n    />\r\n  </view>\r\n\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"content nvue\">\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"键盘弹起时，是否自动上推页面\"\r\n        @change=\"change_adjust_position_boolean\"\r\n      ></boolean-data>\n      <!-- #ifdef !APP -->\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否显示键盘上方带有”完成“按钮那一栏\"\r\n        @change=\"change_show_confirm_bar_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true\"\r\n        @change=\"change_fixed_boolean\"\r\n      ></boolean-data>\n      <!-- #endif -->\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"是否自动增高，设置auto-height时，style.height不生效\"\r\n        @change=\"change_auto_height_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"点击键盘右下角按钮时是否保持键盘不收起\"\r\n        @change=\"change_confirm_hold_boolean\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"focus_boolean\"\r\n        title=\"获取焦点\"\r\n        @change=\"change_focus_boolean\" class=\"textarea-focus\"\r\n      ></boolean-data>\r\n      <boolean-data\r\n        :defaultValue=\"false\"\r\n        title=\"自动获取焦点\"\r\n        @change=\"change_auto_focus_boolean\"\r\n      ></boolean-data>\r\n      <enum-data class=\"textarea-confirm\"\r\n        :items=\"confirm_type_enum\"\r\n        title=\"设置键盘右下角按钮的文字\"\r\n        @change=\"radio_change_confirm_type_enum\"\r\n      ></enum-data>\r\n      <enum-data\r\n        :items=\"inputmode_enum\" class=\"textarea-input\"\r\n        title=\"是一个枚举属性，它提供了用户在编辑元素或其内容时可能输入的数据类型的提示。在符合条件的高版本webview里，uni-app的 web 和 app-vue 平台中可使用本属性。\"\r\n        @change=\"radio_change_inputmode_enum\"\r\n      ></enum-data>\r\n    </view>\r\n    <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<style>\r\n.main {\r\n  max-height: 500rpx;\r\n  padding: 10rpx 0;\r\n  border-bottom: 1px solid rgba(0, 0, 0, 0.06);\r\n  flex-direction: row;\r\n  justify-content: center;\r\n}\r\n\r\n.main .list-item {\r\n  width: 100%;\r\n  height: 200rpx;\r\n  border: 1px solid #666;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| textarea | 5.0 | √ | 3.9+ | 9.0 | √ | - |\n| @confirm | 5.0 | √ | 3.9+ | - | - | - |\n| @input | 5.0 | √ | 3.9+ | - | - | - |\n| @linechange | 5.0 | √ | 3.9+ | - | - | - |\n| @blur | 5.0 | √ | 3.9+ | - | - | - |\n| @keyboardheightchange | 5.0 | √ | 3.9+ | - | - | - |\n| @focus | 5.0 | √ | 3.9+ | - | - | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/textarea)\n"},"video":{"name":"## video","description":"视频","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| loop | Boolean | false | 是否循环播放 |\n| src | String\\|TagVideoURIString | - | 视频资源地址 |\n| initial-time | Number | - | 指定视频初始播放位置 |\n| duration | Number | - | 指定视频长度 |\n| controls | Boolean | true | 是否显示默认播放控件（播放/暂停按钮、播放进度、时间） |\n| danmu-list | Array | - | 弹幕列表 |\n| danmu-btn | Boolean | false | 是否显示弹幕按钮，只在初始化时有效，不能动态变更 |\n| enable-danmu | Boolean | false | 是否展示弹幕，只在初始化时有效，不能动态变更 |\n| autoplay | Boolean | false | 是否自动播放 |\n| muted | Boolean | false | 是否静音播放 |\n| page-gesture | Boolean | false | 在非全屏模式下，是否开启亮度与音量调节手势 |\n| direction | Number | -90 | 设置全屏时视频的方向，不指定则根据宽高比自动判断。有效值为 0（正常竖向）, 90（屏幕逆时针90度）, -90（屏幕顺时针90度） |\n| show-progress | Boolean | true | 若不设置，宽度大于240时才会显示 |\n| show-fullscreen-btn | Boolean | true | 是否显示全屏按钮 |\n| show-play-btn | Boolean | true | 是否显示视频底部控制栏的播放按钮 |\n| show-center-play-btn | Boolean | true | 是否显示视频中间的播放按钮 |\n| show-loading | Boolean | true | 是否显示loading控件 |\n| enable-progress-gesture | Boolean | true | 是否开启控制进度的手势 |\n| objectFit | String | contain | 当视频大小与 video 容器大小不一致时，视频的表现形式。 [objectFit](#objectFit-values) |\n| poster | String | - | 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 |\n| show-mute-btn | Boolean | false | 是否显示静音按钮 |\n| title | String | - | 视频的标题，全屏时在顶部展示 |\n| play-btn-position | String | - | 播放按钮的位置 |\n| enable-play-gesture | Boolean | false | 是否开启播放手势，即双击切换播放、暂停 |\n| auto-pause-if-navigate | Boolean | - | 当跳转到其它小程序页面时，是否自动暂停本页面的视频 |\n| auto-pause-if-open-native | Boolean | - | 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 |\n| vslide-gesture | Boolean | false | 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） |\n| vslide-gesture-in-fullscreen | Boolean | true | 在全屏模式下，是否开启亮度与音量调节手势 |\n| ad-unit-id | String | - | 视频前贴广告单元ID |\n| poster-for-crawler | String | - | 用于给搜索等场景作为视频封面展示，建议使用无播放 icon 的视频封面图，只支持网络地址 |\n| codec | String | hardware | 解码器选择 |\n| http-cache | Boolean | false | 是否对 http、https 视频源开启本地缓存 |\n| play-strategy | Number | 0 | 播放策略 |\n| is-live | Boolean | - | 是否为直播源 |\n| @play | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当开始/继续播放时触发play事件 |\n| @pause | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当暂停播放时，触发pause事件 |\n| @ended | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当播放到视频末尾时触发ended事件 |\n| @timeupdate | (event: [Event](/uni-app-x/component/common#event)) => void | - | 播放进度变化时触发，event.detail = {currentTime, duration} 。触发频率 250ms 一次 |\n| @fullscreenchange | (event: [Event](/uni-app-x/component/common#event)) => void | - | 当视频进入和退出全屏是触发，event.detail = {fullScreen, direction}，direction取为 vertical 或 horizontal |\n| @waiting | (event: [Event](/uni-app-x/component/common#event)) => void | - | 视频出现缓冲时触发 |\n| @error | (event: [Event](/uni-app-x/component/common#event)) => void | - | 播放出错试触发事件 |\n| @progress | (event: [Event](/uni-app-x/component/common#event)) => void | - | 加载进度变化时触发，只支持一段加载。event.detail = {buffered}，百分比 |\n| @loadedmetadata | (event: [Event](/uni-app-x/component/common#event)) => void | - | 视频元数据加载完成时触发。event.detail = {width, height, duration} |\n\n#### objectFit @objectFit-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| contain | 包含 |\n| fill | 填充 |\n| cover | 覆盖 |\n\n","event":"","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/video/video.uvue) \n ```html\n<template>\n  <view class=\"uni-flex-item\">\n    <video class=\"video\" ref=\"video\" id=\"video\" :header=\"header\" :src=src :autoplay=\"autoplay\" :loop=\"loop\"\n      :muted=\"muted\" :initial-time=\"initialTime\" :duration=\"duration\" :controls=\"controls\" :danmu-btn=\"danmuBtn\"\n      :enable-danmu=\"enableDanmu\" :page-gesture=\"pageGesture\" :direction=\"direction\" :show-progress=\"showProgress\"\n      :show-fullscreen-btn=\"showFullscreenBtn\" :show-play-btn=\"showPlayBtn\" :show-center-play-btn=\"showCenterPlayBtn\"\n      :show-loading=\"showLoading\" :enable-progress-gesture=\"enableProgressGesture\" :object-fit=\"objectFit\"\n      :poster=\"poster\" :show-mute-btn=\"showMuteBtn\" :title=\"title\" :enable-play-gesture=\"enablePlayGesture\"\n      :vslide-gesture=\"vslideGesture\" :vslide-gesture-in-fullscreen=\"vslideGestureInFullscreen\" :codec=\"codec\"\n      :http-cache=\"httpCache\" :play-strategy=\"playStrategy\" :danmu-list=\"danmuList\" @play=\"onPlay\" @pause=\"onPause\"\n      @ended=\"onEnded\" @timeupdate=\"onTimeUpdate\" @waiting=\"onWaiting\" @error=\"onError\" @progress=\"onProgress\"\n      @fullscreenclick=\"onFullScreenClick\" @controlstoggle=\"onControlsToggle\" @fullscreenchange=\"onFullScreenChange\">\n    </video>\n    <scroll-view class=\"uni-padding-wrap uni-common-mt uni-flex-item\">\n      <view class=\"uni-title\">\n        <text class=\"uni-title-text\">API示例</text>\n      </View>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"play\">播放</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"pause\">暂停</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"seek(pos)\">跳转到指定位置</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"requestFullScreen(requestFullScreenOptions)\">进入全屏</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"exitFullScreen\">退出全屏</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"stop\">停止</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"sendDanmu(danmu)\">发送弹幕</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"playbackRate(rate)\">设置倍速</button>\n      </view>\n      <view class=\"uni-title\">\n        <text class=\"uni-title-text\">属性示例</text>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setSrc(_src)\">设置播放资源</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setAutoplay()\">设置是否自动播放（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setLoop()\">设置是否循环播放（本次播放完成后生效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setMuted()\">设置是否静音播放</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setInitialTime(_initialTime)\">设置初始播放位置（本次播放完成后生效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDuration(_duration)\">设置视频时长（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setControls()\">设置是否显示默认播放控件</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDanmuBtn()\">设置是否显示弹幕按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPageGesture()\">非全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setDirection(_direction)\">设置全屏时视频的方向</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowProgress()\">设置是否显示进度条</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowFullscreenBtn()\">设置是否显示全屏按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowPlayBtn()\">设置是否显示视频底部控制栏的播放按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowCenterPlayBtn()\">设置是否显示视频中间的播放按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowLoading()\">设置是否显示loading控件</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setEnableProgressGesture()\">设置是否开启控制进度的手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setObjectFit(_objectFit)\">设置视频大小与video容器大小不一致时，视频的表现形式</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPoster(_poster)\">设置视频封面</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setShowMuteBtn()\">设置是否显示静音按钮</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setTitle(_title)\">设置视频标题</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setEnablePlayGesture()\">设置是否开启播放手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setVslideGesture()\">非全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setVslideGestureInFullscreen()\">全屏模式下，设置是否开启亮度与音量调节手势</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setCodec(_codec)\">设置解码器（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setHttpCache()\">设置是否对http、https视频源开启本地缓存（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setPlayStrategy(_playStrategy)\">设置播放策略（未播放时设置有效）</button>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"setHeader(_header)\">设置header</button>\n      </view>\n    </scroll-view>\n  </view>\n</template>\n\n<script lang=\"uts\">\n  export default {\n    onReady() {\n      this.videoContext = uni.createVideoContext('video', this);\n    },\n    data() {\n      return {\n        videoContext: null as VideoContext | null,\n        // 属性\n        src: \"https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v\",\n        _src: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-app-video-courses.mp4\",\n        autoplay: false,\n        loop: false,\n        muted: false,\n        initialTime: 0,\n        _initialTime: 6,\n        duration: -1,\n        _duration: 60,\n        controls: true,\n        danmuList: [{\n          text: '要显示的文本',\n          color: '#FF0000',\n          time: 3\n        }, {\n          text: '要显示的文本2',\n          color: '#31ff23',\n          time: 5\n        }, {\n          text: '要显示的文本3',\n          color: '#f13ef8',\n          time: 7\n        }, {\n          text: '要显示的文本4',\n          color: '#4972f8',\n          time: 9\n        }, {\n          text: '要显示的文本5',\n          color: '#000000',\n          time: 11\n        }] as Array<Danmu>,\n        danmuBtn: false,\n        enableDanmu: true,\n        pageGesture: false,\n        direction: -90,\n        _direction: 0,\n        requestFullScreenOptions: {\n          direction: -90\n        } as RequestFullScreenOptions,\n        showProgress: true,\n        showFullscreenBtn: true,\n        showPlayBtn: true,\n        showCenterPlayBtn: true,\n        showLoading: true,\n        enableProgressGesture: true,\n        objectFit: \"contain\",\n        _objectFit: \"fill\",\n        poster: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-android.png\",\n        _poster: \"https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-ios.png\",\n        showMuteBtn: false,\n        title: \"video-component\",\n        _title: \"video-component video-component\",\n        enablePlayGesture: false,\n        vslideGesture: false,\n        vslideGestureInFullscreen: true,\n        codec: \"hardware\",\n        _codec: \"software\",\n        httpCache: true,\n        playStrategy: 0,\n        _playStrategy: 2,\n        header: {\n          'User-Agent': 'header test'\n        } as UTSJSONObject,\n        _header: {\n          'User-Agent': 'header test2'\n        } as UTSJSONObject,\n        // API\n        pos: 10,\n        rate: 1.5,\n        danmu: {\n          text: '要显示的文本',\n          color: '#FF0000'\n        } as Danmu,\n        // 自动化测试\n        isPlaying: false,\n        isPause: false,\n        isFullScreen: false\n      }\n    },\n    methods: {\n      // API\n      play: function () {\n        console.log(\"play\");\n        this.videoContext?.play();\n      },\n      pause: function () {\n        console.log(\"pause\");\n        this.videoContext?.pause();\n      },\n      seek: function (pos : number) {\n        console.log(\"seek -> \" + pos);\n        this.videoContext?.seek(pos);\n      },\n      requestFullScreen: function (options : RequestFullScreenOptions) {\n        console.log(\"requestFullScreen -> \" + options);\n        this.videoContext?.requestFullScreen(options);\n      },\n      exitFullScreen: function () {\n        console.log(\"exitFullScreen\");\n        this.videoContext?.exitFullScreen();\n      },\n      stop: function () {\n        console.log(\"stop\");\n        this.videoContext?.stop();\n      },\n      sendDanmu: function (danmu : Danmu) {\n        console.log(\"sendDanmu -> \" + danmu);\n        this.videoContext?.sendDanmu(danmu);\n      },\n      playbackRate: function (rate : number) {\n        console.log(\"playbackRate -> \" + rate);\n        this.videoContext?.playbackRate(rate);\n      },\n      // 属性\n      setSrc: function (src : string) {\n        this.src = src;\n        console.log(\"src -> \" + this.src)\n      },\n      setAutoplay: function () {\n        this.autoplay = !this.autoplay;\n        console.log(\"autoplay -> \" + this.autoplay)\n      },\n      setLoop: function () {\n        this.loop = !this.loop;\n        console.log(\"loop -> \" + this.loop)\n      },\n      setMuted: function () {\n        this.muted = !this.muted;\n        console.log(\"muted -> \" + this.muted)\n      },\n      setInitialTime: function (initialTime : number) {\n        this.initialTime = initialTime;\n        console.log(\"initialTime -> \" + this.initialTime)\n      },\n      setDuration: function (duration : number) {\n        this.duration = duration;\n        console.log(\"duration -> \" + this.duration)\n      },\n      setControls: function () {\n        this.controls = !this.controls;\n        console.log(\"controls -> \" + this.controls)\n      },\n      setDanmuBtn: function () {\n        this.danmuBtn = !this.danmuBtn;\n        console.log(\"danmuBtn -> \" + this.danmuBtn)\n      },\n      setPageGesture: function () {\n        this.pageGesture = !this.pageGesture;\n        console.log(\"pageGesture -> \" + this.pageGesture)\n      },\n      setDirection: function (direction: number) {\n        this.direction = direction;\n        console.log(\"direction -> \" + this.direction)\n      },\n      setShowProgress: function () {\n        this.showProgress = !this.showProgress;\n        console.log(\"showProgress -> \" + this.showProgress)\n      },\n      setShowFullscreenBtn: function () {\n        this.showFullscreenBtn = !this.showFullscreenBtn;\n        console.log(\"showFullscreenBtn -> \" + this.showFullscreenBtn)\n      },\n      setShowPlayBtn: function () {\n        this.showPlayBtn = !this.showPlayBtn;\n        console.log(\"showPlayBtn -> \" + this.showPlayBtn)\n      },\n      setShowCenterPlayBtn: function () {\n        this.showCenterPlayBtn = !this.showCenterPlayBtn;\n        console.log(\"showCenterPlayBtn -> \" + this.showCenterPlayBtn)\n      },\n      setShowLoading: function () {\n        this.showLoading = !this.showLoading;\n        console.log(\"showLoading -> \" + this.showLoading)\n      },\n      setEnableProgressGesture: function () {\n        this.enableProgressGesture = !this.enableProgressGesture;\n        console.log(\"enableProgressGesture -> \" + this.enableProgressGesture)\n      },\n      setObjectFit: function (objectFit : string) {\n        this.objectFit = objectFit;\n        console.log(\"objectFit -> \" + this.objectFit)\n      },\n      setPoster: function (poster : string) {\n        this.poster = poster;\n        console.log(\"poster -> \" + this.poster)\n      },\n      setShowMuteBtn: function () {\n        this.showMuteBtn = !this.showMuteBtn;\n        console.log(\"showMuteBtn -> \" + this.showMuteBtn)\n      },\n      setTitle: function (title : string) {\n        this.title = title;\n        console.log(\"title -> \" + this.title)\n      },\n      setEnablePlayGesture: function () {\n        this.enablePlayGesture = !this.enablePlayGesture;\n        console.log(\"enablePlayGesture -> \" + this.enablePlayGesture)\n      },\n      setVslideGesture: function () {\n        this.vslideGesture = !this.vslideGesture;\n        console.log(\"vslideGesture -> \" + this.vslideGesture)\n      },\n      setVslideGestureInFullscreen: function () {\n        this.vslideGestureInFullscreen = !this.vslideGestureInFullscreen;\n        console.log(\"vslideGestureInFullscreen -> \" + this.vslideGestureInFullscreen)\n      },\n      setCodec: function (codec : string) {\n        this.codec = codec;\n        console.log(\"codec -> \" + this.codec)\n      },\n      setHttpCache: function () {\n        this.httpCache = !this.httpCache;\n        console.log(\"httpCache -> \" + this.httpCache)\n      },\n      setPlayStrategy: function (playStrategy : number) {\n        this.playStrategy = playStrategy;\n        console.log(\"playStrategy -> \" + this.playStrategy)\n      },\n      setHeader: function (header : UTSJSONObject) {\n        this.header = header;\n        console.log(\"header -> \" + this.header)\n      },\n      // 事件\n      onPlay: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isPlaying = true;\n        this.isPause = false;\n      },\n      onPause: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isPlaying = false;\n        this.isPause = true;\n      },\n      onEnded: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onTimeUpdate: function (_ : any) {\n        // console.log(JSON.stringify(res));\n      },\n      onFullScreenChange: function (res : any) {\n        console.log(JSON.stringify(res));\n        this.isFullScreen = !this.isFullScreen;\n      },\n      onWaiting: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onError: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onProgress: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onFullScreenClick: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      onControlsToggle: function (res : any) {\n        console.log(JSON.stringify(res));\n      },\n      // 自动化测试\n      playTest: function () {\n        this.videoContext?.play();\n      },\n      pauseTest: function () {\n        this.videoContext?.pause();\n      },\n      requestFullScreenTest: function () {\n        const options : RequestFullScreenOptions = {\n          direction: -90\n        };\n        this.videoContext?.requestFullScreen(options);\n      },\n      exitFullScreenTest: function () {\n        this.videoContext?.exitFullScreen();\n      },\n      stopTest: function () {\n        this.videoContext?.stop();\n      }\n    }\n  }\n</script>\n\n<style>\n  .video {\n    width: 750rpx;\n    height: 400rpx;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| video | 5.0 | √ | 3.9.0 | 9.0 | √ | - |\n| play-btn-position | 5.0 | x | x | 9.0 | x | - |\n| auto-pause-if-navigate | 5.0 | x | x | 9.0 | x | - |\n| auto-pause-if-open-native | 5.0 | x | x | 9.0 | x | - |\n| ad-unit-id | 5.0 | x | x | 9.0 | x | - |\n| poster-for-crawler | 5.0 | x | x | 9.0 | x | - |\n| is-live | 5.0 | x | x | 9.0 | x | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/video)\n"},"view":{"name":"## view","description":"基本视图容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| hover-class | 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/master/pages/component/view/view.uvue) \n ```html\n<template>\r\n  <page-head title=\"view\"></page-head>\n  <view class=\"main\" :hover-class=\"hover_class ? 'is-parent-hover' : 'none'\">\n    <view class=\"test-view\" :hover-class=\"hover_class ? 'is-hover' : 'none'\" :hover-stop-propagation=\"stop_propagation\" :hover-start-time=\"start_time\" :hover-stay-time=\"stay_time\">\n    </view>\n  </view>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n    <!-- #endif -->\n    <view class=\"content\">\n      <boolean-data :defaultValue=\"false\" title=\"是否指定按下去的样式类\" @change=\"change_hover_class_boolean\"></boolean-data>\n      <boolean-data :defaultValue=\"false\" title=\"是否阻止本节点的祖先节点出现点击态\" @change=\"change_stop_propagation_boolean\"></boolean-data>\n      <enum-data :items=\"start_time_enum\" title=\"按住后多久出现点击态\" @change=\"radio_change_start_time_enum\"></enum-data>\n      <enum-data :items=\"stay_time_enum\" title=\"手指松开后点击态保留时间\" @change=\"radio_change_stay_time_enum\"></enum-data>\n      <view class=\"uni-padding-wrap uni-common-mt uni-common-mb\">\n        <button class=\"uni-common-mt\" @click=\"goGeneralAttribute('/pages/component/view/view-draw')\">DrawableContext</button>\n      </view>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\r\n</template>\r\n<script>\nimport { type ItemType } from '@/components/enum-data/enum-data.vue'\r\nexport 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  },\r\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    },\r\n    goGeneralAttribute(path: string) {\r\n      uni.navigateTo({\r\n        url: path,\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.main {\r\n    padding: 10rpx 0;\r\n    flex-direction: row;\r\n    justify-content: center;\r\n}\r\n.test-view {\n  height: 200px;\n  width: 200px;\n  background-color: white;\n}\r\n.text {\r\n  color: #777;\r\n  font-size: 26rpx;\r\n}\n.is-hover {\r\n    background-color: #179b16;\r\n}\n\n.is-parent-hover {\r\n    background-color: #aa0000;\r\n}\r\n</style>\r\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| view | 5.0 | √ | √ | - | - | - |\n| hover-class | 5.0 | √ | √ | - | - | - |\n| hover-stop-propagation | 5.0 | √ | √ | - | - | - |\n| hover-start-time | 5.0 | √ | √ | - | - | - |\n| hover-stay-time | 5.0 | √ | √ | - | - | - |\n","children":"","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/view)\n"},"web-view":{"name":"## web-view","description":"承载网页的容器","attrubute":"### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| src | String\\|URIString | - | webview 指向网页的链接 |\n| webview-styles | WebViewStyles | {\"progress\":{\"color\":\"#00FF00\"}} | webview 的样式 |\n| @message | (event: [WebViewMessageEvent](#webviewmessageevent)) => void | - | 网页向应用 postMessage 时触发。e.detail = { data } |\n| @error | (event: [WebViewErrorEvent](#webviewerrorevent)) => void | - | 网页加载错误时触发。e.detail = { errMsg } |\n| @loaded | (event: [WebViewLoadedEvent](#webviewloadedevent)) => void | - | 网页加载完成后触发。 |\n| @loading | (event: [WebViewLoadingEvent](#webviewloadingevent)) => void | - | 网页加载中触发。 |","event":"\n### 事件\n#### WebViewMessageEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [WebViewMessageEvent detail](#webviewmessageevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### WebViewMessageEvent detail 属性值 @webviewmessageevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| data | Map\\<string, any> | 否 | - |  消息包含的数据 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewErrorEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| detail | [WebViewErrorEvent detail](#webviewerrorevent-values) | 是 | - | - |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n###### WebViewErrorEvent detail 属性值 @webviewerrorevent-values \n\n| 名称 | 类型 | 必备 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| errMsg | string | 是 | - |  错误信息 |\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewLoadedEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n\n#### WebViewLoadingEvent\n\n##### 属性值\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| type | string | 是 | - |  事件类型 |\n| target | [Element](/uni-app-x/dom/element.md) | 是 | - |  触发事件的组件 |\n| currentTarget | [Element](/uni-app-x/dom/element.md) | 是 | - |  当前组件 |\n| timeStamp | number | 是 | - |  事件发生时的时间戳 |\n\n\n##### 方法\n| 名称 | 类型 | 必填 | 默认值 | 描述 |\n| :- | :- | :- | :- | :- |\n| stopPropagation | () => void | 是 | - |  阻止当前事件的进一步传播 |\n| preventDefault | () => void | 是 | - |  阻止当前事件的默认行为 |\n","example":"### 示例 \n> [hello uni-app x](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/master/pages/component/web-view/web-view.uvue) \n ```html\n<template>\n  <view class=\"uni-flex-item\">\n    <web-view id=\"web-view\" class=\"uni-flex-item\" :src=\"src\" :webview-styles=\"webview_styles\" @message=\"message\"\n      @error=\"error\" @loading=\"loading\" @loaded=\"loaded\">\n    </web-view>\n    <view class=\"uni-padding-wrap uni-common-mt\">\n      <view class=\"uni-input-v\">\n        <input class=\"uni-input\" confirmType=\"go\" placeholder=\"输入网址跳转\" @confirm=\"confirm\" />\n      </view>\n      <view class=\"uni-row uni-btn-v\">\n        <view class=\"uni-flex-item\">\n          <button type=\"primary\" @click=\"back\">后退</button>\n        </view>\n        <view class=\"uni-btn-ml uni-flex-item\">\n          <button type=\"primary\" @click=\"forward\">前进</button>\n        </view>\n      </view>\n      <view class=\"uni-row uni-btn-v\">\n        <view class=\"uni-flex-item\">\n          <button type=\"primary\" @click=\"reload\">重新加载</button>\n        </view>\n        <view class=\"uni-btn-ml uni-flex-item\">\n          <button type=\"primary\" @click=\"stop\">停止加载</button>\n        </view>\n      </view>\n      <view class=\"uni-btn-v\">\n        <button type=\"primary\" @click=\"nativeToWeb\">原生和Web通信</button>\n      </view>\n    </view>\n  </view>\n</template>\n\n<script>\n  export default {\n    data() {\n      return {\n        src: 'https://www.dcloud.io',\n        webview_styles: {\n          progress: {\n            color: '#FF3333'\n          }\n        },\n        webviewContext: null as WebviewContext | null,\n        loadError: false\n      }\n    },\n    onReady() {\n      this.webviewContext = uni.createWebviewContext('web-view', this)\n    },\n    methods: {\n      back() {\n        this.webviewContext?.back();\n      },\n      forward() {\n        this.webviewContext?.forward();\n      },\n      reload() {\n        this.webviewContext?.reload();\n      },\n      stop() {\n        this.webviewContext?.stop();\n      },\n      nativeToWeb() {\n        this.webviewContext?.evalJS(\"alert('hello uni-app x')\");\n      },\n      message(event : WebViewMessageEvent) {\n        console.log(JSON.stringify(event.detail));\n      },\n      error(event : WebViewErrorEvent) {\n        this.loadError = true\n        console.log(JSON.stringify(event.detail));\n      },\n      loading(event : WebViewLoadingEvent) {\n        console.log(JSON.stringify(event.type));\n      },\n      loaded(event : WebViewLoadedEvent) {\n        console.log(JSON.stringify(event.type));\n      },\n      confirm(event : InputConfirmEvent) {\n        console.log(event.detail.value);\n        let url = event.detail.value;\n        if (!url.startsWith('https://') && !url.startsWith('http://')) {\n          url = 'https://' + url;\n        }\n        this.src = url;\n      }\n    }\n  }\n</script>\n\n<style>\n  .uni-input-v {\n    padding: 10rpx 0;\n  }\n\n  .uni-btn-ml {\n    margin-left: 10rpx;\n  }\n</style>\n\n```","compatibility":"\n### 兼容性\n|  | 安卓系统版本 | 安卓 uni-app | 安卓 uni-app-x | iOS 系统版本 | iOS uni-app | iOS uni-app-x |\n| :- | :- | :- | :- | :- | :- | :- |\n| web-view | 5.0 | √ | 3.9.0 | 9.0 | √ | - |\n","children":"### 子组件 @children-tags \n 不可以嵌套组件","reference":"\n### 参见\n- [Reference](https://uniapp.dcloud.io/component/web-view)\n"}}
\ No newline at end of file
-- 
GitLab