tmui-cli 2.0.3 → 2.0.5

package/data/uniappx/api/dialog-page.md

@@ -0,0 +1,377 @@
+## dialogPage概述
+HBuilderX 4.31+新增了dialogPage，适用于制作弹框和内置界面。
+
+### 需求背景
+- uni.showModal、actionsheet，自定义性不足
+- 通过前端组件实现的弹框，无法覆盖pages.json的导航栏和tabbar
+- 前端实现的弹框，无法拦截back按键，一点back整页关了
+- 组件方式实现弹框，需要每个页面都引入组件，写法较麻烦
+- 部分内置API涉及界面但没有统一管理，比如chooseLocation、previewImage等。
+
+### dialogPage方案
+dialogPage是一种背景透明的页面，可以覆盖pages.json中的导航栏和tabbar。之前的page被称为主page或parentPage。dialogPage需要挂在主page上。
+
+dialogPage是一种特殊的page，它和主page有很多相同之处：
+- dialogPage需在pages.json注册
+- dialogPage有页面生命周期，onLoad里也可以拿到各种参数
+- dialogPage里如果引用了组件，对于组件而言，其page就是dialogPage。组合式组件中监听onPageShow，是监听dialogPage，而不是dialogPage的parentPage。
+- dialogPage可以通过uni.$on等eventbus方案进行页面级通信
+
+dialogPage和主page的区别：
+- dialogPage的背景固定为透明、大小为铺满应用。蒙层由页面内部实现，蒙层颜色、是否响应点击，均由页面内部处理。如果是模态，蒙层不应该允许点击；非模态，则点击蒙层应关闭dialogPage
+- dialogPage不使用uni.navigatorTo等路由API，而是单独提供了`openDialogPage`和`closeDialogPage`
+- dialogPage不影响页面栈和路由地址，在getCurrentPages里不能直接得到dialogPage（需在UniPage对象通过getDialogPages获取）
+- 因为dialogPage不进入主页面栈，那么`uni.getElementById`是无法获取到dialogPage内的元素的。因为uni这个全局API是获取栈顶元素。如果想获取指定页面的元素，需获取到指定页面的UniPage对象，在这个对象上使用.getElementById方法。如果想获取当前dialogPage页面的元素，应该使用 `this.$page.getElementById()(Options API)` | `getCurrentInstance()?.proxy?.$page.getElementById()(Composition API)`。
+- dialogPage在Android上并不是一个activity，而是一个全屏view，它和主page所属同一个activity。
+- dialogPage默认不响应iOS侧滑返回，即disableSwipeBack默认值为true，可以在pages.json中进行配置。响应Android和Harmony的back键和back手势，可通过dialogPage onBackPress生命周期控制是否阻止Android的back键和back手势关闭dialogPage。
+- dialogPage默认不影响调用页面或其parentPage的show、hide生命周期。如需影响，比如弹出全屏界面时，需手动设置triggerParentHide
+- dialogPage中可以调用普通路由api，比如uni.navigateTo、navigateBack，但并不作用于dialogPage，而是作用于其parentPage。即，之前的路由API均只作用于主Page。
+- 在web平台，dialogPage显示时，不影响URL的变化。
+- dialogPage默认没有窗体动画。如果是半屏内容，建议在页面内通过css或uts操作页面元素进行动画，灵活度更高。如果是全屏界面，可以使用窗体动画，但没有popin这种与上一个页面的联动动画。
+
+dialogPage的绑定：
+- dialogPage需绑定在某个主页面上，即parentPage。parentPage页面关闭时，自动销毁相关dialogPage。
+- 在app的onLaunch调用openDialogPage，绑定到首页。
+- `openDialogPage` 时可通过 `parentPage` 参数指定所属页面，不指定时默认为当前页面。
+
+多dialogPage注意事项：
+- dialogPage可以有多个，通过UniPage对象的getDialogPages()可以获取主页面挂载的所有dialogPage。
+- 多个dialogPage层叠时，可以通过close api任意关闭某个dialogPage。
+- 当前 dialogPage 打开时会触发前一个 dialogPage onHide 生命周期，关闭时会触发前一个 dialogPage onShow 生命周期。
+- `uni.showActionSheet`、`uni.showModal`、`uni.showLoading` 打开的弹框也是由 dialogPage 实现，所以调用这些 API 时，会触发前一个 dialogPage 的 onHide 生命周期，关闭对应弹框时，会触发前一个 dialogPage 的 onShow 生命周期。
+
+调用时机注意事项：
+- 最早的调用时机是在app的onLaunch里调用openDialogPage，不支持在main.uts中调用openDialogPage。
+
+app-android平台注意事项：
+- dialogPage不会创建Android原生Activity，复用parentPage的Android原生Activity。
+
+APP 蒸汽模式注意事项：
+- 蒸汽模式下，页面会默认嵌套一层 `scroll-view` 节点，详见[页面的可滚动性](https://doc.dcloud.net.cn/uni-app-x/page.html#disablescroll)。\
+如果希望页面不可滚动，可以在[pages.json](./collocation/pagesjson.md#pagesoptionspage-style)的页面Style中配置`disableScroll:true`禁用页面滚动，此配置项仅禁用页面自身的滚动，页面内的 `scroll-view` 组件不受影响。
+
+::: sourceCode
+## uni.openDialogPage(options) @opendialogpage
+
+> GitCode: https://gitcode.com/dcloud/uni-api/tree/alpha/uni_modules/uni-dialogPage
+
+> GitHub: https://github.com/dcloudio/uni-api/tree/alpha/uni_modules/uni-dialogPage
+
+打开模态弹窗页面
+
+### openDialogPage 兼容性  
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 4.31 | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | 4.31 | 4.31 | 4.61 |
+
+### 参数 
+
+| 名称 | 类型 | 必填 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| options | **OpenDialogPageOptions** | 是 | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 打开 dialogPage 参数 |
+| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |
+| :- | :- | :- | :- |  :-: | :- |
+| url | string (string.PageURIString) | 是 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数 |
+| animationType | string | 否 | none | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 窗口显示的动画类型<br/> |
+@@| 合法值 | 兼容性 | 描述 |
+@@| :- |  :-: | :- |
+@@| auto | 微信小程序 x（部分支持，见上） | 自动选择动画效果 |
+@@| none | 微信小程序 x（部分支持，见上） | 无动画效果 |
+@@| slide-in-right | 微信小程序 x（部分支持，见上） | 从右侧横向滑动效果 |
+@@| slide-in-left | 微信小程序 x（部分支持，见上） | 左侧横向滑动效果 |
+@@| slide-in-top | 微信小程序 x（部分支持，见上） | 从上侧竖向滑动效果 |
+@@| slide-in-bottom | 微信小程序 x（部分支持，见上） | 从下侧竖向滑动效果 |
+@@| fade-in | 微信小程序 x（部分支持，见上） | 从透明到不透明逐渐显示效果 |
+@@| zoom-out | 微信小程序 x（部分支持，见上） | 从小到大逐渐放大显示效果 |
+@@| zoom-fade-out | 微信小程序 x（部分支持，见上） | 从小到大逐渐放大并且从透明到不透明逐渐显示效果 |
+| animationDuration | number | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 窗口关闭动画的持续时间，单位为 ms |
+| disableEscBack | boolean | 否 | false | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 是否禁用按键盘 ESC 时关闭 |
+| parentPage | UniPage | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 要绑定的父级页面实例 |
+| triggerParentHide | boolean | 否 | false | Web 4.41 / 微信小程序 x / Android 4.41 / iOS 4.41 / HarmonyOS 4.61（部分支持，见上） | 是否触发父页面的 onHide 生命周期 |
+| success | (result: [OpenDialogPageSuccess](#opendialogpagesuccess-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用成功的回调函数 |
+| fail | (result: [OpenDialogPageFail](#opendialogpagefail-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用失败的回调函数 |
+| complete | (result: [OpenDialogPageComplete](#opendialogpagecomplete-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用结束的回调函数（调用成功、失败都会执行） | 
+
+#### OpenDialogPageSuccess 的属性值 @opendialogpagesuccess-values 
+
+| 名称 | 类型 | 必备 | 兼容性 |
+| :- | :- | :- |  :-: |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |
+
+#### OpenDialogPageFail 的属性值 @opendialogpagefail-values 
+
+| 名称 | 类型 | 必备 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| errCode | number | 是 | 微信小程序 x（部分支持，见上） | 路由错误码<br/>- 4: 框架内部异常 |
+| errSubject | string | 是 | 微信小程序 x（部分支持，见上） | 统一错误主题（模块）名称 |
+| data | any | 否 | 微信小程序 x（部分支持，见上） | 错误信息中包含的数据 |
+| cause | Error | 否 |   | 源错误信息，可以包含多个错误，详见SourceError |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |  |
+
+#### OpenDialogPageComplete 的属性值 @opendialogpagecomplete-values 
+
+| 名称 | 类型 | 必备 | 兼容性 |
+| :- | :- | :- |  :-: |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |
+
+### 返回值 
+
+| 类型 | 必备 |
+| :- | :- |
+| UniPage | 否 |
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=api.page.dialogPage.openDialogPage)
+- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=openDialogPage&doc_type=miniprogram)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=openDialogPage&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=openDialogPage&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=openDialogPage&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=openDialogPage&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=openDialogPage)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=openDialogPage&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)
+
+::: sourceCode
+## uni.closeDialogPage(options?) @closedialogpage
+
+> GitCode: https://gitcode.com/dcloud/uni-api/tree/alpha/uni_modules/uni-dialogPage
+
+> GitHub: https://github.com/dcloudio/uni-api/tree/alpha/uni_modules/uni-dialogPage
+
+关闭模态弹窗页面
+
+`closeDialogPage` 可通过 `dialogPage` 参数指定要关闭的 `dialogPage`, 不指定时默认关闭当前页面的所有 `dialogPage`。
+
+### closeDialogPage 兼容性  
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 4.31 | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | 4.31 | 4.31 | 4.61 |
+
+### 参数 
+
+| 名称 | 类型 | 必填 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| options | **CloseDialogPageOptions** | 否 | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 关闭 dialogPage 参数 |
+| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |
+| :- | :- | :- | :- |  :-: | :- |
+| dialogPage | UniPage | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 要关闭的 dialogPage 实例 |
+| animationType | string | 否 | auto | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 窗口关闭的动画类型<br/> |
+@@| 合法值 | 兼容性 | 描述 |
+@@| :- |  :-: | :- |
+@@| auto | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 自动选择动画效果 |
+@@| none | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 无动画效果 |
+@@| slide-out-right | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 横向向右侧滑出屏幕动画 |
+@@| slide-out-left | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 横向向左侧滑出屏幕动画 |
+@@| slide-out-top | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 竖向向上侧滑出屏幕动画 |
+@@| slide-out-bottom | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 竖向向下侧滑出屏幕动画 |
+@@| fade-out | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 从不透明到透明逐渐隐藏动画 |
+@@| zoom-in | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 从大逐渐缩小关闭动画 |
+@@| zoom-fade-in | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 从大逐渐缩小并且从不透明到透明逐渐隐藏关闭动画 |
+| animationDuration | number | 否 |  | Web x / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 窗口关闭动画的持续时间，单位为 ms |
+| success | (result: [CloseDialogPageSuccess](#closedialogpagesuccess-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用成功的回调函数 |
+| fail | (result: [CloseDialogPageFail](#closedialogpagefail-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用失败的回调函数 |
+| complete | (result: [CloseDialogPageComplete](#closedialogpagecomplete-values)) => void | 否 |  | Web 4.31 / 微信小程序 x / Android 4.31 / iOS 4.31 / HarmonyOS 4.61（部分支持，见上） | 接口调用结束的回调函数（调用成功、失败都会执行） | 
+
+#### CloseDialogPageSuccess 的属性值 @closedialogpagesuccess-values 
+
+| 名称 | 类型 | 必备 | 兼容性 |
+| :- | :- | :- |  :-: |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |
+
+#### CloseDialogPageFail 的属性值 @closedialogpagefail-values 
+
+| 名称 | 类型 | 必备 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| errCode | number | 是 | 微信小程序 x（部分支持，见上） | 路由错误码<br/>- 4: 框架内部异常 |
+| errSubject | string | 是 | 微信小程序 x（部分支持，见上） | 统一错误主题（模块）名称 |
+| data | any | 否 | 微信小程序 x（部分支持，见上） | 错误信息中包含的数据 |
+| cause | Error | 否 |   | 源错误信息，可以包含多个错误，详见SourceError |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |  |
+
+#### CloseDialogPageComplete 的属性值 @closedialogpagecomplete-values 
+
+| 名称 | 类型 | 必备 | 兼容性 |
+| :- | :- | :- |  :-: |
+| errMsg | string | 是 | 微信小程序 x（部分支持，见上） |
+
+### 返回值 
+
+| 类型 |
+| :- |
+| null |
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=api.page.dialogPage.closeDialogPage)
+- [微信小程序文档](https://developers.weixin.qq.com/doc/search.html?source=enter&query=closeDialogPage&doc_type=miniprogram)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=closeDialogPage&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=closeDialogPage&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=closeDialogPage&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=closeDialogPage&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=closeDialogPage)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=closeDialogPage&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)
+
+## 示例
+
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/API/dialog-page/dialog-page.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/API/dialog-page/dialog-page.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/API/dialog-page/dialog-page
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/API/dialog-page/dialog-page
+
+>示例
+```vue
+<template>
+  
+  <scroll-view class="uni-theme-root" style="flex: 1;">
+  
+  <page-intro content="本页演示 dialog 弹窗与页面信息：展示 pageBody、safeAreaInsets、窗口尺寸等；通过按钮跳转下一页、打开各 dialog 示例（含错误路径、triggerParentHide、页面样式等）。"></page-intro>
+  <view class="uni-padding-wrap uni-theme-root">
+    <view class="uni-common-mt flex-row" v-if="data.pageBody != null"><text class="dialog-page-text">pageBody: {</text>
+      <text class="dialog-page-text">top: </text><text id="page-body-top" class="dialog-page-text">{{data.pageBody!.top}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">right: </text><text id="page-body-right" class="dialog-page-text">{{data.pageBody!.right}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">bottom: </text><text id="page-body-bottom" class="dialog-page-text">{{data.pageBody!.bottom}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">left: </text><text id="page-body-left" class="dialog-page-text">{{data.pageBody!.left}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">width: </text><text id="page-body-width" class="dialog-page-text">{{data.pageBody!.width}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">height: </text><text id="page-body-height" class="dialog-page-text">{{data.pageBody!.height}}</text>
+      <text class="dialog-page-text">}</text>
+    </view>
+    <view class="uni-common-mt flex-row" v-if="data.safeAreaInsets != null"><text class="dialog-page-text">safeAreaInsets: {</text>
+      <text class="dialog-page-text">top: </text><text id="page-safe-area-insets-top" class="dialog-page-text">{{data.safeAreaInsets!.top}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">right: </text><text id="page-safe-area-insets-right" class="dialog-page-text">{{data.safeAreaInsets!.right}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">bottom: </text><text id="page-safe-area-insets-bottom" class="dialog-page-text">{{data.safeAreaInsets!.bottom}}</text><text class="dialog-page-text">,</text>
+      <text class="dialog-page-text">left: </text><text id="page-safe-area-insets-left" class="dialog-page-text">{{data.safeAreaInsets!.left}}</text><text class="dialog-page-text">}</text>
+    </view>
+    
+    <view class="uni-common-mt flex-row" v-if="data.width != null"><text class="dialog-page-text">width: </text><text id="page-width" class="dialog-page-text">{{data.width!}}</text>
+    </view>
+    <view class="uni-common-mt flex-row" v-if="data.height != null"><text class="dialog-page-text">height: </text><text id="page-height" class="dialog-page-text">{{data.height!}}</text>
+    </view>
+    <view class="uni-common-mt flex-row" v-if="data.statusBarHeight != null"><text class="dialog-page-text">statusBarHeight: </text><text id="page-statusBarHeight" class="dialog-page-text">{{data.statusBarHeight!}}</text>
+    </view>
+    
+    <button class="uni-common-mt" id="go-next-page" @click="goNextPage">
+      go next page
+    </button>
+    <button class="uni-common-mt" id="open-dialog1" @click="openDialog1">
+      open dialog 1
+    </button>
+    <button class="uni-common-mt" id="open-dialog-navigation-bar-text-style" @click="openDialogNavigationBarTextStyle">
+      open dialog test navigationBarTextStyle restore
+    </button>
+    <button class="uni-common-mt" id="open-dialog11" @click="openDialog11">
+      open dialog 1-1
+    </button>
+    <button class="uni-common-mt" id="open-dialog1-wrong-path" @click="openDialog1WrongPath">
+      open dialog page 1 with wrong path
+    </button>
+    <button class="uni-common-mt" id="go-next-page-open-dialog1" @click="goNextPageOpenDialog1">
+      go next page & open dialog1
+    </button>
+    <button class="uni-common-mt" id="open-dialog3" @click="openDialog3">
+      open dialog 3 test page style
+    </button>
+    <button class="uni-common-mt" id="open-dialog4" @click="openDialogWithTriggerParentHide">
+      openDialog with triggerParentHide
+    </button>
+    <button class="uni-common-mt" id="open-dialog5" @click="openDialogCheckMoreAttribute">
+      openDialog check more attribute
+    </button>
+    <button class="uni-common-mt" id="open-dialog1-with-relative-path" @click="openDialogWithRelativePath">
+      openDialog with relative path
+    </button>
+    <button class="uni-common-mt" id="open-dialog6" @click="openDialogCheckSetNavigationBarColor">
+      openDialog check setNavigationBarColor
+    </button>
+    <button class="uni-common-mt" @click="openDialogWithTextarea">
+      openDialog with textarea
+    </button>
+    <button class="uni-common-mt" @click="openDialogWithInput">
+      openDialog with input
+    </button>
+    <text class="uni-common-mt choose-open-animation-type-title dialog-page-text">choose open dialogPage animationType</text>
+    <radio-group class="choose-open-animation-type-radio-group" @change="handleOpenAnimationType">
+      <view class="ml-10 uni-common-mt dialog-page-radio" v-for="item in data.openAnimationTypeList" :key="item">
+        <radio :value="item" :checked="data.openAnimationType == item" />
+        <text>{{ item }}</text>
+      </view>
+    </radio-group>
+  </view>
+  
+  </scroll-view>
+  
+</template>
+
+
+
+<style>
+  .uni-padding-wrap{
+    padding-bottom: var(--uni-safe-area-inset-bottom);
+  }
+
+  .ml-10 {
+    margin-left: 10px;
+  }
+
+  .choose-open-animation-type-title {
+    font-weight: bold;
+  }
+
+  .choose-open-animation-type-radio-group {
+    flex-direction: row;
+    flex-wrap: wrap;
+    margin-bottom: 20px;
+  }
+  .flex-row{
+    flex-direction: row;
+    flex-wrap: wrap;
+  }
+
+  .dialog-page-text,
+  .dialog-page-radio {
+    color: var(--text-color, #333333);
+  }
+
+  .dialog-page-radio {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
+</style>
+
+```
+
+## 通用类型
+
+### GeneralCallbackResult @generalcallbackresult-values 
+
+| 名称 | 类型 | 必备 | 描述 |
+| :- | :- | :- | :- |
+| errMsg | string | 是 | 错误信息 |
+
+## Tips
+* 可通过如下方式获取 `dialogPage`。
+```js
+// 1. 通过 parentPage 获取 dialogPage 集合
+const pages = getCurrentPages()
+// 获取当前页面
+const page = pages[pages.length-1]
+// 获取当前页面的 `dialogPage` 集合
+const dialogPages = page.getDialogPages()
+
+// 2. 在 dialogPage 中通过 this.$page 获取 dialogPage 实例 (组件中不支持)
+// 选项式 API
+const dialogPage = this.$page
+// 组合式 API
+const currentInstance = getCurrentInstance()
+const dialogPage = currentInstance?.proxy?.$page
+```
+* tabBar 页面中的 `dialogPage`，在 App 端不会随 tabBar 页面切换而隐藏，在 Web 端会随 tabBar 页面切换而隐藏。\
+即：在 tabA 页面打开 dialogPage 后 switchTab 到 tabB 页面
+在 App 端 dialogPage 仍会显示,\
+在 Web 端 dialogPage 会隐藏，再次 switchTab 到 tabA 页面 dialogPage 会显示。