diff --git a/docs/.vuepress/utils/vueJson.json b/docs/.vuepress/utils/vueJson.json
index 1d2b281bd5c5a9c1b27be390a3989f1ea5fcef82..285db96454908cb4a23c36c2f7a2f8090da2bb2e 100644
--- a/docs/.vuepress/utils/vueJson.json
+++ b/docs/.vuepress/utils/vueJson.json
@@ -1 +1 @@
-{"template":{"name":"#### template","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| lang | Any | - |  [lang](#template-lang-values) |\n\n##### lang @template-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| html | html |\n| pug | pug |\n\n","event":"","example":"","compatibility":"\n##### template 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"slot":{"name":"#### slot","description":"> 组件类型：string \n\n \\<slot> 元素作为组件模板之中的内容分发插槽。\\<slot> 元素自身将被替换。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| name | string | - | 用于命名插槽。 |","event":"","example":"","compatibility":"\n##### slot 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#slot)\n"},"script":{"name":"#### script","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| setup | Any | - | - |\n| lang | Any | - |  [lang](#script-lang-values) |\n\n##### lang @script-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| ts | typescript |\n| uts | uts |\n\n\n###### lang 兼容性\n|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| ts | x | x | x |\n| uts | 4.0 | x | 4.0 |\n","event":"","example":"","compatibility":"##### script 属性兼容性\n|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| setup | 4.0 | x | 4.0 |\n\n##### script 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"style":{"name":"#### style","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| lang | Any | - |  [lang](#style-lang-values) |\n| scoped | Any | - | - |\n| module | Any | - | - |\n\n##### lang @style-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| scss | - |\n| less | - |\n| stylus | - |\n\n","event":"","example":"","compatibility":"\n##### style 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"keep-alive":{"name":"#### keep-alive","description":"> 组件类型：string \n\n \\<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 \\<transition> 相似，\\<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| include | string | - | 字符串或正则表达式。只有名称匹配的组件会被缓存。 |\n| exclude | string | - | 字符串或正则表达式。任何名称匹配的组件都不会被缓存。 |\n| max | string | - | 最多可以缓存多少组件实例。 |","event":"","example":"","compatibility":"\n##### keep-alive 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 4.0 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#keep-alive)\n"},"component":{"name":"#### component","description":"> 组件类型：string \n\n 渲染一个“元组件”为动态组件。依 is 的值，来决定哪个组件被渲染。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| is | Any | - | - |\n| inline-template | Any | - | - |","event":"","example":"","compatibility":"\n##### component 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 3.99 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#component)\n"},"transition":{"name":"#### transition","description":"> 组件类型：string \n\n \\<transition> 元素作为单个元素/组件的过渡效果。\\<transition> 只会把过渡效果应用到其包裹的内容上，而不会额外渲染 DOM 元素，也不会出现在检测过的组件层级中。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| name | string | - | 用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为.fade-enter，.fade-enter-active等。默认类名为 \"v\" |\n| appear | string(b) | - | 是否在初始渲染时使用过渡。默认为 false。 |\n| css | string(b) | - | 是否使用 CSS 过渡类。默认为 true。如果设置为 false，将只通过组件事件触发注册的 JavaScript 钩子。 |\n| type | string | - | 指定过渡事件类型，侦听过渡何时结束。有效值为 \"transition\" 和 \"animation\"。默认 Vue.js 将自动检测出持续时间长的为过渡事件类型。 [type](#transition-type-values) |\n| mode | string | - | 控制离开/进入的过渡时间序列。有效的模式有 \"out-in\" 和 \"in-out\"；默认同时生效。 [mode](#transition-mode-values) |\n| duration | string | - | 指定过渡的持续时间。默认情况下，Vue 会等待过渡所在根元素的第一个 transitionend 或 animationend 事件。 |\n| enter-class | Any | - | - |\n| leave-class | Any | - | - |\n| appear-class | Any | - | - |\n| enter-to-class | Any | - | - |\n| leave-to-class | Any | - | - |\n| appear-to-class | Any | - | - |\n| enter-active-class | Any | - | - |\n| leave-active-class | Any | - | - |\n| appear-active-class | Any | - | - |\n| @before-enter | Any | - | - |\n| @before-leave | Any | - | - |\n| @before-appear | Any | - | - |\n| @enter | Any | - | - |\n| @leave | Any | - | - |\n| @appear | Any | - | - |\n| @after-enter | Any | - | - |\n| @after-leave | Any | - | - |\n| @after-appear | Any | - | - |\n| @enter-cancelled | Any | - | - |\n| @leave-cancelled | string | - | v-show only |\n| @appear-cancelled | Any | - | - |\n\n##### type @transition-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| transition | - |\n| animation | - |\n\n\n\n##### mode @transition-mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| out-in | - |\n| in-out | - |\n\n","event":"","example":"","compatibility":"\n##### transition 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| x | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#transition)\n"},"transition-group":{"name":"#### transition-group","description":"> 组件类型：string \n\n \\<transition-group> 元素作为多个元素/组件的过渡效果。\\<transition-group> 渲染一个真实的 DOM 元素。默认渲染 \\<span>，可以通过 tag 属性配置哪个元素应该被渲染。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| tag | string | - | 默认为 span。 |\n| move-class | string | - | 覆盖移动过渡期间应用的 CSS 类。 |\n| name | string | - | 用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为.fade-enter，.fade-enter-active等。默认类名为 \"v\" |\n| appear | string(b) | - | 是否在初始渲染时使用过渡。默认为 false。 |\n| css | string(b) | - | 是否使用 CSS 过渡类。默认为 true。如果设置为 false，将只通过组件事件触发注册的 JavaScript 钩子。 |\n| type | string | - | 指定过渡事件类型，侦听过渡何时结束。有效值为 \"transition\" 和 \"animation\"。默认 Vue.js 将自动检测出持续时间长的为过渡事件类型。 [type](#transition-group-type-values) |\n| mode | Any | - | - |\n| duration | string | - | 指定过渡的持续时间。默认情况下，Vue 会等待过渡所在根元素的第一个 transitionend 或 animationend 事件。 |\n| enter-class | Any | - | - |\n| leave-class | Any | - | - |\n| appear-class | Any | - | - |\n| enter-to-class | Any | - | - |\n| leave-to-class | Any | - | - |\n| appear-to-class | Any | - | - |\n| enter-active-class | Any | - | - |\n| leave-active-class | Any | - | - |\n| appear-active-class | Any | - | - |\n| @before-enter | Any | - | - |\n| @before-leave | Any | - | - |\n| @before-appear | Any | - | - |\n| @enter | Any | - | - |\n| @leave | Any | - | - |\n| @appear | Any | - | - |\n| @after-enter | Any | - | - |\n| @after-leave | Any | - | - |\n| @after-appear | Any | - | - |\n| @enter-cancelled | Any | - | - |\n| @leave-cancelled | string | - | v-show only |\n| @appear-cancelled | Any | - | - |\n\n##### type @transition-group-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| transition | - |\n| animation | - |\n\n","event":"","example":"","compatibility":"\n##### transition-group 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| x | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#transition-group)\n"},"teleport":{"name":"#### teleport","description":"> 组件类型：string \n\n Teleport 提供了一种干净的方法，允许我们控制在 DOM 中哪个父节点下呈现 HTML，而不必求助于全局状态或将其拆分为两个组件。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| to | string | - | 必须是有效的查询选择器或 HTMLElement (如果在浏览器环境中使用)。指定将在其中移动 \\<teleport> 内容的目标元素 |\n| disabled | boolean | - | 此可选属性可用于禁用 \\<teleport> 的功能，这意味着其插槽内容将不会移动到任何位置，而是在您在周围父组件中指定了 \\<teleport> 的位置渲染。 |","event":"","example":"","compatibility":"\n##### teleport 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 4.0 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.vuejs.org/api/built-in-components.html#teleport)\n"},"application":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| createApp() | 5.0 | √ | x | 4.0 |\n| createSSRApp() | 5.0 | √ | x | 4.0 |\n| app.mount() | 5.0 | √ | x | 4.0 |\n| app.unmount() | 5.0 | √ | x | 4.0 |\n| app.component() | 5.0 | √ | x | 4.0 |\n| app.directive() | - | - | - | - |\n| app.use() | 5.0 | 3.99 | x | 4.0 |\n| app.mixin() | 5.0 | 3.99 | x | 4.0 |\n| app.provide() | 5.0 | 3.99 | x | 4.0 |\n| app.runWithContext() | - | - | - | - |\n| app.version | 5.0 | √ | x | 4.0 |\n| app.config | - | - | - | - |\n| app.config.errorHandler | 5.0 | x | x | 4.0 |\n| app.config.warnHandler | - | - | - | - |\n| app.config.performance | - | - | - | - |\n| app.config.compilerOptions | - | - | - | - |\n| app.config.globalProperties | 5.0 | 3.99 | x | 4.0 |\n| app.config.optionMergeStrategies | - | - | - | - |","example":""},"general":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| version | 5.0 | √ | x | 4.0 |\n| nextTick() | 5.0 | √ | x | 4.0 |\n| defineComponent() | 5.0 | x | x | 4.0 |\n| defineAsyncComponent() | - | - | - | - |\n| defineCustomElement() | - | - | - | - |","example":""},"reactivity_core":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| ref() | √ | x | 4.0 |\n| computed() | √ | x | 4.0 |\n| reactive() | √ | x | 4.0 |\n| readonly() | 4.0 | x | 4.0 |\n| watchEffect() | 4.0 | x | 4.0 |\n| watchPostEffect() | 4.0 | x | 4.0 |\n| watchSyncEffect() | 4.0 | x | 4.0 |\n| watch() | 4.0 | x | 4.0 |","example":""},"reactivity_utilities":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| isRef() | 4.0 | x | 4.0 |\n| unref() | 4.0 | x | 4.0 |\n| isReactive() | 4.0 | x | 4.0 |\n| isReadonly() | 4.0 | x | 4.0 |\n| toRef() | 4.0 | x | 4.0 |\n| toValue() | 4.0 | x | x |\n| toRefs() | 4.0 | x | 4.0 |\n| isProxy() | 4.0 | x | 4.0 |","example":""},"reactivity_advanced":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| shallowReactive() | 5.0 | 4.0 | x | 4.0 |\n| shallowRef() | 5.0 | 4.0 | x | 4.0 |\n| toRaw() | 5.0 | 4.0 | x | 4.0 |\n| triggerRef() | 5.0 | 4.0 | x | x |\n| customRef() | 5.0 | 4.0 | x | 4.0 |\n| shallowReadonly() | 5.0 | 4.0 | x | 4.0 |\n| markRaw() | - | - | - | - |\n| effectScope() | 5.0 | 4.0 | x | 4.0 |\n| getCurrentScope() | 5.0 | 4.0 | x | 4.0 |\n| onScopeDispose() | 5.0 | 4.0 | x | 4.0 |","example":""},"composition_lifecycle":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| onMounted() | 5.0 | 4.0 | x | 4.0 |\n| onUpdated() | 5.0 | 4.0 | x | 4.0 |\n| onUnmounted() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeMount() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeUpdate() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeUnmount() | 5.0 | 4.0 | x | 4.0 |\n| onErrorCaptured() | - | - | - | - |\n| onRenderTracked() | - | - | - | - |\n| onRenderTriggered() | - | - | - | - |\n| onActivated() | 5.0 | x | x | 4.0 |\n| onDeactivated() | 5.0 | x | x | 4.0 |\n| onServerPrefetch() | - | - | - | - |","example":""},"composition_injection":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| provide() | 4.0 | x | 4.0 |\n| inject() | 4.0 | x | 4.0 |\n| hasInjectionContext() | 4.0 | x | x |","example":""},"options_state":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| data | √ | x | 4.0 |\n| props | √ | x | 4.0 |\n| computed | √ | x | 4.0 |\n| methods | √ | x | 4.0 |\n| watch | √ | x | 4.0 |\n| emits | √ | x | 4.0 |\n| expose | x | x | 4.0 |","example":"#### 状态选项 示例\n- [选项式 API 示例](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/state)"},"options_rendering":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| template | x | x | x |\n| render | √ | x | 4.0 |\n| compilerOptions | x | x | x |\n| slots | √ | x | 4.0 |","example":"#### 渲染选项 示例\n- [指令示例](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/rendering)"},"options_lifecycle":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| beforeCreate | 5.0 | √ | x | 4.0 |\n| created | 5.0 | √ | x | 4.0 |\n| beforeMount | 5.0 | √ | x | 4.0 |\n| mounted | 5.0 | √ | x | 4.0 |\n| beforeUpdate | 5.0 | √ | x | 4.0 |\n| updated | 5.0 | √ | x | 4.0 |\n| beforeUnmount | 5.0 | √ | x | 4.0 |\n| unmounted | 5.0 | √ | x | 4.0 |\n| errorCaptured | 5.0 | x | x | 4.0 |\n| renderTracked | 5.0 | x | x | 4.0 |\n| renderTriggered | 5.0 | x | x | 4.0 |\n| activated | 5.0 | 4.0 | x | 4.0 |\n| deactivated | 5.0 | 4.0 | x | 4.0 |\n| serverPrefetch | - | - | - | - |","example":"#### 页面生命周期示例 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/lifecycle/page/page.uvue) \n ```html\n<template>\n  <!-- #ifdef APP -->\n  <scroll-view style=\"flex: 1\">\n    <!-- #endif -->\n    <view class=\"page container\">\n      <text>page lifecycle</text>\n      <button class=\"uni-common-mt\" @click=\"scrollToBottom\">scrollToBottom</button>\n    </view>\n    <!-- #ifdef APP -->\n  </scroll-view>\n  <!-- #endif -->\n</template>\n\n<script lang=\"uts\">\nimport { state, setLifeCycleNum } from '@/store/index.uts'\n\nexport default {\n  data() {\n    return {\n      isScrolled: false,\n    }\n  },\n  onLoad(_ : OnLoadOptions) {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 100)\n  },\n  onShow() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\n  },\n  onReady() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\n  },\n  onPullDownRefresh() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\n  },\n  onPageScroll(_) {\n    // 自动化测试\n    this.isScrolled = true\n  },\n  onReachBottom() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\n  },\n  onBackPress(_ : OnBackPressOptions) : boolean | null {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum - 10)\n    return null\n  },\n  onHide() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum - 10)\n  },\n  onUnload() {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum - 100)\n  },\n  onResize(_){\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\n  },\n  methods: {\n    // 自动化测试\n    getLifeCycleNum() : number {\n      return state.lifeCycleNum\n    },\n    // 自动化测试\n    setLifeCycleNum(num : number) {\n      setLifeCycleNum(num)\n    },\n    // 自动化测试\n    pullDownRefresh() {\n      uni.startPullDownRefresh({\n        success() {\n          setTimeout(() => {\n            uni.stopPullDownRefresh()\n          }, 1000)\n        },\n      })\n    },\n    scrollToBottom() {\n      uni.pageScrollTo({\n        scrollTop: 2000,\n      })\n    },\n  },\n}\n</script>\n\n<style>\n.container {\n  height: 1200px;\n}\n</style>\n\n```\n#### 组件生命周期示例 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/lifecycle/component/component.uvue) \n ```html\n<template>\n  <view class=\"page\">\n    <text class=\"uni-common-mb\">component lifecycle</text>\n    <component-lifecycle class=\"component-lifecycle\" />\n  </view>\n</template>\n\n<script>\nimport ComponentLifecycle from '@/components/OptionsAPILifecycle.uvue'\nimport { state } from '@/store/index.uts'\nexport default {\n  components: { ComponentLifecycle },\n  methods: {\n    // 自动化测试\n    getLifeCycleNum(): number {\n      return state.lifeCycleNum\n    },\n  },\n}\n</script>\n\n```"},"options_composition":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| provide | 5.0 | 3.99 | x | 4.0 |\n| inject | 5.0 | 3.99 | x | 4.0 |\n| mixins | 5.0 | 3.99 | x | 4.0 |\n| extends | - | - | - | - |","example":""},"options_misc":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| name | 5.0 | √ | x | 4.0 |\n| inheritAttrs | 5.0 | √ | x | 4.0 |\n| components | 5.0 | √ | x | 4.0 |\n| directives | - | - | - | - |","example":""},"component_instance":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| $data | √ | x | 4.0 |\n| $props | √ | x | 4.0 |\n| $el | √ | x | 4.0 |\n| $options | √ | x | 4.0 |\n| $parent | √ | x | 4.0 |\n| $root | √ | x | 4.0 |\n| $slots | √ | x | 4.0 |\n| $refs | √ | x | 4.0 |\n| $attrs | √ | x | 4.0 |\n| $watch() | √ | x | 4.0 |\n| $emit | √ | x | 4.0 |\n| $forceUpdate | √ | x | 4.0 |\n| $nextTick | √ | x | 4.0 |\n| $callMethod | √ | x | 4.0 |","example":"#### 组件实例 示例\n- [组件实例示例](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/component-instance)"},"directives":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| v-text | √ | x | 4.0 |\n| v-html | 3.99 | x | 4.0 |\n| v-show | √ | x | 4.0 |\n| v-if | √ | x | 4.0 |\n| v-else | √ | x | 4.0 |\n| v-else-if | √ | x | 4.0 |\n| v-for | √ | x | 4.0 |\n| v-on | √ | x | 4.0 |\n| v-bind | √ | x | 4.0 |\n| v-model | √ | x | 4.0 |\n| v-slot | √ | x | 4.0 |\n| v-pre | 3.99 | x | 4.0 |\n| v-once | 3.99 | x | 4.0 |\n| v-memo | 3.99 | x | 4.0 |\n| v-cloak | x | x | 4.0 |","example":"#### 指令 示例\n- [指令示例](https://gitcode.net/dcloud/hello-uvue/-/tree/master//pages/directive)"},"special_attributes":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| key | √ | x | 4.0 |\n| ref | √ | x | 4.0 |\n| is | 3.99 | x | 4.0 |","example":""},"render_function":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| h() | 5.0 | 3.99 | x | 4.0 |\n| mergeProps() | 5.0 | 4.0 | x | 4.0 |\n| cloneVNode() | 5.0 | 4.0 | x | 4.0 |\n| isVNode() | 5.0 | √ | x | 4.0 |\n| resolveComponent() | 5.0 | √ | x | 4.0 |\n| resolveDirective() | - | - | - | - |\n| withDirectives() | 5.0 | √ | x | 4.0 |\n| withModifiers() | 5.0 | √ | x | 4.0 |","example":""},"single_file_component_script":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| defineProps() | 4.0 | x | 4.0 |\n| defineEmits() | 4.0 | x | 4.0 |\n| defineModel() | 4.0 | x | x |\n| defineExpose() | 4.0 | x | 4.0 |\n| defineOptions() | 4.0 | x | x |\n| defineSlots() | 4.0 | x | 4.0 |\n| useSlots() | 4.0 | x | 4.0 |\n| useAttrs() | 4.0 | x | 4.0 |","example":""}}
\ No newline at end of file
+{"template":{"name":"#### template","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| lang | Any | - |  [lang](#template-lang-values) |\n\n##### lang @template-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| html | html |\n| pug | pug |\n\n","event":"","example":"","compatibility":"\n##### template 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"slot":{"name":"#### slot","description":"> 组件类型：string \n\n \\<slot> 元素作为组件模板之中的内容分发插槽。\\<slot> 元素自身将被替换。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| name | string | - | 用于命名插槽。 |","event":"","example":"","compatibility":"\n##### slot 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#slot)\n"},"script":{"name":"#### script","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| setup | Any | - | - |\n| lang | Any | - |  [lang](#script-lang-values) |\n\n##### lang @script-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| ts | typescript |\n| uts | uts |\n\n\n###### lang 兼容性\n|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| ts | x | x | x |\n| uts | 4.0 | x | 4.0 |\n","event":"","example":"","compatibility":"##### script 属性兼容性\n|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| setup | 4.0 | x | 4.0 |\n\n##### script 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"style":{"name":"#### style","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| lang | Any | - |  [lang](#style-lang-values) |\n| scoped | Any | - | - |\n| module | Any | - | - |\n\n##### lang @style-lang-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| scss | - |\n| less | - |\n| stylus | - |\n\n","event":"","example":"","compatibility":"\n##### style 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| √ | x | 4.0 |\n","children":"","reference":""},"keep-alive":{"name":"#### keep-alive","description":"> 组件类型：string \n\n \\<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 \\<transition> 相似，\\<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| include | string | - | 字符串或正则表达式。只有名称匹配的组件会被缓存。 |\n| exclude | string | - | 字符串或正则表达式。任何名称匹配的组件都不会被缓存。 |\n| max | string | - | 最多可以缓存多少组件实例。 |","event":"","example":"","compatibility":"\n##### keep-alive 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 4.0 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#keep-alive)\n"},"component":{"name":"#### component","description":"> 组件类型：string \n\n 渲染一个“元组件”为动态组件。依 is 的值，来决定哪个组件被渲染。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| is | Any | - | - |\n| inline-template | Any | - | - |","event":"","example":"","compatibility":"\n##### component 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 3.99 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#component)\n"},"transition":{"name":"#### transition","description":"> 组件类型：string \n\n \\<transition> 元素作为单个元素/组件的过渡效果。\\<transition> 只会把过渡效果应用到其包裹的内容上，而不会额外渲染 DOM 元素，也不会出现在检测过的组件层级中。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| name | string | - | 用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为.fade-enter，.fade-enter-active等。默认类名为 \"v\" |\n| appear | string(b) | - | 是否在初始渲染时使用过渡。默认为 false。 |\n| css | string(b) | - | 是否使用 CSS 过渡类。默认为 true。如果设置为 false，将只通过组件事件触发注册的 JavaScript 钩子。 |\n| type | string | - | 指定过渡事件类型，侦听过渡何时结束。有效值为 \"transition\" 和 \"animation\"。默认 Vue.js 将自动检测出持续时间长的为过渡事件类型。 [type](#transition-type-values) |\n| mode | string | - | 控制离开/进入的过渡时间序列。有效的模式有 \"out-in\" 和 \"in-out\"；默认同时生效。 [mode](#transition-mode-values) |\n| duration | string | - | 指定过渡的持续时间。默认情况下，Vue 会等待过渡所在根元素的第一个 transitionend 或 animationend 事件。 |\n| enter-class | Any | - | - |\n| leave-class | Any | - | - |\n| appear-class | Any | - | - |\n| enter-to-class | Any | - | - |\n| leave-to-class | Any | - | - |\n| appear-to-class | Any | - | - |\n| enter-active-class | Any | - | - |\n| leave-active-class | Any | - | - |\n| appear-active-class | Any | - | - |\n| @before-enter | Any | - | - |\n| @before-leave | Any | - | - |\n| @before-appear | Any | - | - |\n| @enter | Any | - | - |\n| @leave | Any | - | - |\n| @appear | Any | - | - |\n| @after-enter | Any | - | - |\n| @after-leave | Any | - | - |\n| @after-appear | Any | - | - |\n| @enter-cancelled | Any | - | - |\n| @leave-cancelled | string | - | v-show only |\n| @appear-cancelled | Any | - | - |\n\n##### type @transition-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| transition | - |\n| animation | - |\n\n\n\n##### mode @transition-mode-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| out-in | - |\n| in-out | - |\n\n","event":"","example":"","compatibility":"\n##### transition 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| x | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#transition)\n"},"transition-group":{"name":"#### transition-group","description":"> 组件类型：string \n\n \\<transition-group> 元素作为多个元素/组件的过渡效果。\\<transition-group> 渲染一个真实的 DOM 元素。默认渲染 \\<span>，可以通过 tag 属性配置哪个元素应该被渲染。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| tag | string | - | 默认为 span。 |\n| move-class | string | - | 覆盖移动过渡期间应用的 CSS 类。 |\n| name | string | - | 用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为.fade-enter，.fade-enter-active等。默认类名为 \"v\" |\n| appear | string(b) | - | 是否在初始渲染时使用过渡。默认为 false。 |\n| css | string(b) | - | 是否使用 CSS 过渡类。默认为 true。如果设置为 false，将只通过组件事件触发注册的 JavaScript 钩子。 |\n| type | string | - | 指定过渡事件类型，侦听过渡何时结束。有效值为 \"transition\" 和 \"animation\"。默认 Vue.js 将自动检测出持续时间长的为过渡事件类型。 [type](#transition-group-type-values) |\n| mode | Any | - | - |\n| duration | string | - | 指定过渡的持续时间。默认情况下，Vue 会等待过渡所在根元素的第一个 transitionend 或 animationend 事件。 |\n| enter-class | Any | - | - |\n| leave-class | Any | - | - |\n| appear-class | Any | - | - |\n| enter-to-class | Any | - | - |\n| leave-to-class | Any | - | - |\n| appear-to-class | Any | - | - |\n| enter-active-class | Any | - | - |\n| leave-active-class | Any | - | - |\n| appear-active-class | Any | - | - |\n| @before-enter | Any | - | - |\n| @before-leave | Any | - | - |\n| @before-appear | Any | - | - |\n| @enter | Any | - | - |\n| @leave | Any | - | - |\n| @appear | Any | - | - |\n| @after-enter | Any | - | - |\n| @after-leave | Any | - | - |\n| @after-appear | Any | - | - |\n| @enter-cancelled | Any | - | - |\n| @leave-cancelled | string | - | v-show only |\n| @appear-cancelled | Any | - | - |\n\n##### type @transition-group-type-values \n\n| 值名称 | 描述 |\n| :- | :- |\n| transition | - |\n| animation | - |\n\n","event":"","example":"","compatibility":"\n##### transition-group 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| x | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.cn.vuejs.org/api/built-in-components.html#transition-group)\n"},"teleport":{"name":"#### teleport","description":"> 组件类型：string \n\n Teleport 提供了一种干净的方法，允许我们控制在 DOM 中哪个父节点下呈现 HTML，而不必求助于全局状态或将其拆分为两个组件。","attrubute":"##### 属性 \n| 名称 | 类型 | 默认值 | 描述 |\n| :- | :- | :- | :- |\n| to | string | - | 必须是有效的查询选择器或 HTMLElement (如果在浏览器环境中使用)。指定将在其中移动 \\<teleport> 内容的目标元素 |\n| disabled | boolean | - | 此可选属性可用于禁用 \\<teleport> 的功能，这意味着其插槽内容将不会移动到任何位置，而是在您在周围父组件中指定了 \\<teleport> 的位置渲染。 |","event":"","example":"","compatibility":"\n##### teleport 兼容性\n| Android | iOS | web |\n| :- | :- | :- |\n| 4.0 | x | 4.0 |\n","children":"","reference":"\n##### 参见\n- [Reference](https://v3.vuejs.org/api/built-in-components.html#teleport)\n"},"application":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| createApp() | 5.0 | √ | x | 4.0 |\n| createSSRApp() | 5.0 | √ | x | 4.0 |\n| app.mount() | 5.0 | √ | x | 4.0 |\n| app.unmount() | 5.0 | √ | x | 4.0 |\n| app.component() | 5.0 | √ | x | 4.0 |\n| app.directive() | - | - | - | - |\n| app.use() | 5.0 | 3.99 | x | 4.0 |\n| app.mixin() | 5.0 | 3.99 | x | 4.0 |\n| app.provide() | 5.0 | 3.99 | x | 4.0 |\n| app.runWithContext() | - | - | - | - |\n| app.version | 5.0 | √ | x | 4.0 |\n| app.config | - | - | - | - |\n| app.config.errorHandler | 5.0 | x | x | 4.0 |\n| app.config.warnHandler | - | - | - | - |\n| app.config.performance | - | - | - | - |\n| app.config.compilerOptions | - | - | - | - |\n| app.config.globalProperties | 5.0 | 3.99 | x | 4.0 |\n| app.config.optionMergeStrategies | - | - | - | - |","example":""},"general":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| version | 5.0 | √ | x | 4.0 |\n| nextTick() | 5.0 | √ | x | 4.0 |\n| defineComponent() | 5.0 | x | x | 4.0 |\n| defineAsyncComponent() | - | - | - | - |\n| defineCustomElement() | - | - | - | - |","example":""},"reactivity_core":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| ref() | √ | x | 4.0 |\n| computed() | √ | x | 4.0 |\n| reactive() | √ | x | 4.0 |\n| readonly() | 4.0 | x | 4.0 |\n| watchEffect() | 4.0 | x | 4.0 |\n| watchPostEffect() | 4.0 | x | 4.0 |\n| watchSyncEffect() | 4.0 | x | 4.0 |\n| watch() | 4.0 | x | 4.0 |","example":""},"reactivity_utilities":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| isRef() | 4.0 | x | 4.0 |\n| unref() | 4.0 | x | 4.0 |\n| isReactive() | 4.0 | x | 4.0 |\n| isReadonly() | 4.0 | x | 4.0 |\n| toRef() | 4.0 | x | 4.0 |\n| toValue() | 4.0 | x | x |\n| toRefs() | 4.0 | x | 4.0 |\n| isProxy() | 4.0 | x | 4.0 |","example":""},"reactivity_advanced":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| shallowReactive() | 5.0 | 4.0 | x | 4.0 |\n| shallowRef() | 5.0 | 4.0 | x | 4.0 |\n| toRaw() | 5.0 | 4.0 | x | 4.0 |\n| triggerRef() | 5.0 | 4.0 | x | x |\n| customRef() | 5.0 | 4.0 | x | 4.0 |\n| shallowReadonly() | 5.0 | 4.0 | x | 4.0 |\n| markRaw() | - | - | - | - |\n| effectScope() | 5.0 | 4.0 | x | 4.0 |\n| getCurrentScope() | 5.0 | 4.0 | x | 4.0 |\n| onScopeDispose() | 5.0 | 4.0 | x | 4.0 |","example":""},"composition_lifecycle":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| onMounted() | 5.0 | 4.0 | x | 4.0 |\n| onUpdated() | 5.0 | 4.0 | x | 4.0 |\n| onUnmounted() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeMount() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeUpdate() | 5.0 | 4.0 | x | 4.0 |\n| onBeforeUnmount() | 5.0 | 4.0 | x | 4.0 |\n| onErrorCaptured() | - | - | - | - |\n| onRenderTracked() | - | - | - | - |\n| onRenderTriggered() | - | - | - | - |\n| onActivated() | 5.0 | x | x | 4.0 |\n| onDeactivated() | 5.0 | x | x | 4.0 |\n| onServerPrefetch() | - | - | - | - |","example":"#### 页面生命周期 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/composition-api/lifecycle/page-lifecycle/page-lifecycle.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex:1\">\r\n  <!-- #endif -->\r\n    <view class=\"page container\">\r\n      <text>page lifecycle</text>\r\n      <button class=\"uni-common-mt\" @click=\"scrollToBottom\">scrollToBottom</button>\r\n    </view>\r\n  <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script setup>\n  import { state, setLifeCycleNum } from '@/store/index.uts'\n  \n  const isScrolled = ref(false)\n  \r\n  onLoad((_: OnLoadOptions) => {\r\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 100)\r\n  })\r\n  onPageShow(() => {\r\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  })\r\n  onReady(() => {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  })\r\n  onPullDownRefresh(() => {\r\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  })\r\n  onPageScroll((_) => {\n    // 自动化测试\r\n    isScrolled.value = true\r\n  })\r\n  onReachBottom(() => {\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  })\r\n  onBackPress((_: OnBackPressOptions): boolean | null => {\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum - 10)\n    return null\r\n  })\r\n  onPageHide(() => {\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum - 10)\r\n  })\r\n  onUnload(() => {\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum - 100)\r\n  })\r\n  onResize((_) => {\r\n    // 自动化测试\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  })\n  \n  // 自动化测试\n  const getLifeCycleNum = () : number => {\n    return state.lifeCycleNum\n  }\n  // 自动化测试\n  const pageSetLifeCycleNum = (num: number) => {\n    setLifeCycleNum(num)\n  }\n \n  // 自动化测试\n  const pullDownRefresh = () => {\n    uni.startPullDownRefresh({\n      success() {\n        setTimeout(() => {\n          uni.stopPullDownRefresh()\n        }, 1000)\n      },\n    })\n  }\n  \r\n  const scrollToBottom = () => {\r\n    uni.pageScrollTo({\r\n      scrollTop: 2000,\r\n    })\r\n  }\n  \n  // 自动化测试\n  const getIsScrolled = (): boolean => {\n    return isScrolled.value\n  }\n  \n  defineExpose({\n    getLifeCycleNum,\n    pageSetLifeCycleNum,\n    pullDownRefresh,\n    scrollToBottom,\n    getIsScrolled\n  })\r\n</script>\r\n\r\n<style>\r\n  .container {\r\n    height: 1200px;\r\n  }\r\n</style>\n```\n#### 组件生命周期 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/composition-api/lifecycle/component-lifecycle/component-lifecycle.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex:1\">\r\n  <!-- #endif -->\r\n    <view class=\"pag container\">\r\n      <text class=\"uni-common-mb\">component lifecycle</text>\r\n      <component-lifecycle class=\"component-lifecycle\" @updateIsScroll=\"updateIsScroll\" />\r\n      <button class=\"uni-common-mt\" @click=\"scrollToBottom\">scrollToBottom</button>\r\n    </view>\r\n  <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script setup>\r\n  import ComponentLifecycle from '@/components/CompositionAPILifecycle.uvue'\r\n  import { state, setLifeCycleNum } from '@/store/index.uts'\r\n\r\n  const isScrolled = ref(false)\r\n\r\n  // 自动化测试\r\n  const getLifeCycleNum = () : number => {\r\n    return state.lifeCycleNum\r\n  }\r\n\r\n  // 自动化测试\r\n  const pageSetlifeCycleNum = (num : number) => {\r\n    setLifeCycleNum(num)\r\n  }\r\n\r\n  // 自动化测试\r\n  const pullDownRefresh = () => {\r\n    uni.startPullDownRefresh({\r\n      success() {\r\n        setTimeout(() => {\r\n          uni.stopPullDownRefresh()\r\n        }, 1000)\r\n      },\r\n    })\r\n  }\r\n\r\n  const scrollToBottom = () => {\r\n    uni.pageScrollTo({\r\n      scrollTop: 3000,\r\n    })\r\n  }\r\n\r\n  const updateIsScroll = (val : boolean) => {\r\n    isScrolled.value = val\r\n  }\r\n\r\n  // 自动化测试\r\n  const getIsScrolled = () : boolean => {\r\n    return isScrolled.value\r\n  }\r\n\r\n  defineExpose({\r\n    getLifeCycleNum,\r\n    pageSetlifeCycleNum,\r\n    pullDownRefresh,\r\n    scrollToBottom,\r\n    getIsScrolled\r\n  })\r\n</script>\r\n\r\n<style>\r\n  .container {\r\n    height: 1200px;\r\n  }\r\n</style>\n```"},"composition_injection":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| provide() | 4.0 | x | 4.0 |\n| inject() | 4.0 | x | 4.0 |\n| hasInjectionContext() | 4.0 | x | x |","example":""},"options_state":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| data | √ | x | 4.0 |\n| props | √ | x | 4.0 |\n| computed | √ | x | 4.0 |\n| methods | √ | x | 4.0 |\n| watch | √ | x | 4.0 |\n| emits | √ | x | 4.0 |\n| expose | x | x | 4.0 |","example":"#### 状态选项 示例\n- [选项式 API 示例](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/state)"},"options_rendering":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| template | x | x | x |\n| render | √ | x | 4.0 |\n| compilerOptions | x | x | x |\n| slots | √ | x | 4.0 |","example":"#### 渲染选项 示例\n- [指令示例](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/rendering)"},"options_lifecycle":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| beforeCreate | 5.0 | √ | x | 4.0 |\n| created | 5.0 | √ | x | 4.0 |\n| beforeMount | 5.0 | √ | x | 4.0 |\n| mounted | 5.0 | √ | x | 4.0 |\n| beforeUpdate | 5.0 | √ | x | 4.0 |\n| updated | 5.0 | √ | x | 4.0 |\n| beforeUnmount | 5.0 | √ | x | 4.0 |\n| unmounted | 5.0 | √ | x | 4.0 |\n| errorCaptured | 5.0 | x | x | 4.0 |\n| renderTracked | 5.0 | x | x | 4.0 |\n| renderTriggered | 5.0 | x | x | 4.0 |\n| activated | 5.0 | 4.0 | x | 4.0 |\n| deactivated | 5.0 | 4.0 | x | 4.0 |\n| serverPrefetch | - | - | - | - |","example":"#### 页面生命周期示例 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/lifecycle/page/page.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n    <!-- #endif -->\r\n    <view class=\"page container\">\r\n      <text>page lifecycle</text>\r\n      <button class=\"uni-common-mt\" @click=\"scrollToBottom\">scrollToBottom</button>\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, setLifeCycleNum } from '@/store/index.uts'\r\n\r\nexport default {\r\n  data() {\r\n    return {\r\n      isScrolled: false,\r\n    }\r\n  },\r\n  onLoad(_ : OnLoadOptions) {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 100)\r\n  },\r\n  onShow() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  },\r\n  onReady() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  },\r\n  onPullDownRefresh() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  },\r\n  onPageScroll(_) {\r\n    // 自动化测试\r\n    this.isScrolled = true\r\n  },\r\n  onReachBottom() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  },\r\n  onBackPress(_ : OnBackPressOptions) : boolean | null {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum - 10)\r\n    return null\r\n  },\r\n  onHide() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum - 10)\r\n  },\r\n  onUnload() {\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum - 100)\r\n  },\r\n  onResize(_){\r\n    // 自动化测试\r\n    setLifeCycleNum(state.lifeCycleNum + 10)\r\n  },\r\n  methods: {\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    pullDownRefresh() {\r\n      uni.startPullDownRefresh({\r\n        success() {\r\n          setTimeout(() => {\r\n            uni.stopPullDownRefresh()\r\n          }, 1000)\r\n        },\r\n      })\r\n    },\r\n    scrollToBottom() {\r\n      uni.pageScrollTo({\r\n        scrollTop: 2000,\r\n      })\r\n    },\r\n  },\r\n}\r\n</script>\r\n\r\n<style>\r\n.container {\r\n  height: 1200px;\r\n}\r\n</style>\r\n\n```\n#### 组件生命周期示例 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/lifecycle/component/component.uvue) \n ```html\n<template>\r\n  <view class=\"page\">\r\n    <text class=\"uni-common-mb\">component lifecycle</text>\r\n    <component-lifecycle class=\"component-lifecycle\" />\r\n  </view>\r\n</template>\r\n\r\n<script>\r\nimport ComponentLifecycle from '@/components/OptionsAPILifecycle.uvue'\r\nimport { state } from '@/store/index.uts'\r\nexport default {\r\n  components: { ComponentLifecycle },\r\n  methods: {\r\n    // 自动化测试\r\n    getLifeCycleNum(): number {\r\n      return state.lifeCycleNum\r\n    },\r\n  },\r\n}\r\n</script>\r\n\n```"},"options_composition":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| provide | 5.0 | 3.99 | x | 4.0 |\n| inject | 5.0 | 3.99 | x | 4.0 |\n| mixins | 5.0 | 3.99 | x | 4.0 |\n| extends | - | - | - | - |","example":""},"options_misc":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| name | 5.0 | √ | x | 4.0 |\n| inheritAttrs | 5.0 | √ | x | 4.0 |\n| components | 5.0 | √ | x | 4.0 |\n| directives | - | - | - | - |","example":""},"component_instance":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| $data | √ | x | 4.0 |\n| $props | √ | x | 4.0 |\n| $el | √ | x | 4.0 |\n| $options | √ | x | 4.0 |\n| $parent | √ | x | 4.0 |\n| $root | √ | x | 4.0 |\n| $slots | √ | x | 4.0 |\n| $refs | √ | x | 4.0 |\n| $attrs | √ | x | 4.0 |\n| $watch() | √ | x | 4.0 |\n| $emit | √ | x | 4.0 |\n| $forceUpdate | √ | x | 4.0 |\n| $nextTick | √ | x | 4.0 |\n| $callMethod | √ | x | 4.0 |","example":"#### 组件实例 示例\n- [组件实例示例](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/component-instance)"},"directives":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| v-text | √ | x | 4.0 |\n| v-html | 3.99 | x | 4.0 |\n| v-show | √ | x | 4.0 |\n| v-if | √ | x | 4.0 |\n| v-else | √ | x | 4.0 |\n| v-else-if | √ | x | 4.0 |\n| v-for | √ | x | 4.0 |\n| v-on | √ | x | 4.0 |\n| v-bind | √ | x | 4.0 |\n| v-model | √ | x | 4.0 |\n| v-slot | √ | x | 4.0 |\n| v-pre | 3.99 | x | 4.0 |\n| v-once | 3.99 | x | 4.0 |\n| v-memo | 3.99 | x | 4.0 |\n| v-cloak | x | x | 4.0 |","example":"#### 指令 示例\n- [指令示例](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/directive)"},"special_attributes":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| key | √ | x | 4.0 |\n| ref | √ | x | 4.0 |\n| is | 3.99 | x | 4.0 |","example":""},"render_function":{"compatibility":"|  | Android 系统版本 | Android | iOS | web |\n| :- | :- | :- | :- | :- |\n| h() | 5.0 | 3.99 | x | 4.0 |\n| mergeProps() | 5.0 | 4.0 | x | 4.0 |\n| cloneVNode() | 5.0 | 4.0 | x | 4.0 |\n| isVNode() | 5.0 | √ | x | 4.0 |\n| resolveComponent() | 5.0 | √ | x | 4.0 |\n| resolveDirective() | - | - | - | - |\n| withDirectives() | 5.0 | √ | x | 4.0 |\n| withModifiers() | 5.0 | √ | x | 4.0 |","example":""},"single_file_component_script":{"compatibility":"|  | Android | iOS | web |\n| :- | :- | :- | :- |\n| defineProps() | 4.0 | x | 4.0 |\n| defineEmits() | 4.0 | x | 4.0 |\n| defineModel() | 4.0 | x | x |\n| defineExpose() | 4.0 | x | 4.0 |\n| defineOptions() | 4.0 | x | x |\n| defineSlots() | 4.0 | x | 4.0 |\n| useSlots() | 4.0 | x | 4.0 |\n| useAttrs() | 4.0 | x | 4.0 |","example":"#### \\<script setup> 示例 \n> [hello uvue](https://gitcode.net/dcloud/hello-uvue/-/tree/alpha/pages/composition/setup/setup.uvue) \n ```html\n<template>\r\n  <!-- #ifdef APP -->\r\n  <scroll-view style=\"flex: 1\">\r\n  <!-- #endif -->\r\n    <view class=\"page\">\r\n      <text class='uni-common-mt' id=\"str\">str: {{ str }}</text>\r\n      <text class='uni-common-mt' id=\"num\">num: {{ num }}</text>\r\n      <text class='uni-common-mt' id=\"bool\">bool: {{ bool }}</text>\r\n      <text class='uni-common-mt' id=\"count\">count: {{count}}</text>\r\n      <button class='uni-common-mt' id=\"increment-btn\" @click=\"increment\">increment</button>\r\n      <text class='uni-common-mt' id=\"obj-str\">obj.str: {{ obj['str'] }}</text>\r\n      <text class='uni-common-mt' id=\"obj-num\">obj.num: {{ obj['num'] }}</text>\r\n      <text class='uni-common-mt' id=\"obj-bool\">obj.bool: {{ obj['bool'] }}</text>\r\n      <button class='uni-common-mt' id=\"update-obj-btn\" @click=\"updateObj\">update obj</button>\r\n      <!-- #ifdef APP -->\r\n      <RenderFunction :str='str' :count='count' :obj='obj' @compUpdateObj='compUpdateObj' :isShow='true' />\r\n      <!-- #endif -->\r\n      <Foo>\r\n        <text class=\"uni-common-mt\" id=\"default-slot-in-foo\">default slot in Foo</text>\r\n      </Foo>\r\n    </view>\r\n  <!-- #ifdef APP -->\r\n  </scroll-view>\r\n  <!-- #endif -->\r\n</template>\r\n\r\n<script>\r\n  // #ifdef APP\r\n  import RenderFunction from './RenderFunction.uvue'\r\n  // #endif\r\n  import Foo from './Foo.uvue'\r\n  export default {\r\n    components: {\r\n      // #ifdef APP\r\n      RenderFunction,\r\n      // #endif\r\n      Foo\r\n    },\r\n    setup() {\r\n      const count = ref(0)\r\n      // 函数只能通过声明变量,赋值函数的方式,不支持 function xxx(){}\r\n      const increment = () => { count.value++ }\r\n      const obj = reactive({\r\n        str: 'obj default str',\r\n        num: 0,\r\n        bool: false,\r\n      })\r\n      const updateObj = () => {\r\n        obj['str'] = 'obj new str'\r\n        obj['num'] = 100\r\n        obj['bool'] = true\r\n      }\r\n      const compUpdateObj = () => {\r\n        obj['str'] = 'obj new str by comp update'\r\n        obj['num'] = 200\r\n        obj['bool'] = true\r\n      }\r\n      return {\r\n        str: 'default str',\r\n        num: 0,\r\n        bool: false,\r\n        count,\r\n        increment,\r\n        obj,\r\n        updateObj,\r\n        compUpdateObj\r\n      }\r\n    }\r\n  }\r\n</script>\n```"}}
\ No newline at end of file
diff --git a/docs/vue/README.md b/docs/vue/README.md
index b5f4ed98b0ab36e1f0433404b5edb81a17f1bbba..11451c15bebc68856b65a0a75c2897baddff3778 100644
--- a/docs/vue/README.md
+++ b/docs/vue/README.md
@@ -105,6 +105,7 @@ const doubleCount = computed<number>(() : number => {
 ### 生命周期钩子
 
 <!-- VUEJSON.composition_lifecycle.compatibility -->
+<!-- VUEJSON.composition_lifecycle.example -->
 
 #### [函数 event 参数的类型](../tutorial/codegap.md#function-event-argument-type)
 
@@ -439,6 +440,8 @@ export default {
 
 <!-- VUEJSON.single_file_component_script.compatibility -->
 
+<!-- VUEJSON.single_file_component_script.example -->
+
 **注意：**
 - `defineProps` 仅支持数组字面量、对象字面量定义（等同于 `options` 中的 `props`规则）及使用纯类型参数的方式来声明。
 ```ts