mirror of
https://gitee.com/wot-design-uni/wot-design-uni.git
synced 2025-12-06 17:18:40 +08:00
docs: ✏️ 修复基础组件文档问题 - 阶段一完成 (#1220)
* docs(button): 更新按钮组件文档对开放能力的描述 - 修改 session-message-title 和 session-message-path 属性名称 - 新增 chooseavatar 和 agreeprivacyauthorization 事件回调 * docs(icon): 更新图标组件文档 - 调整属性描述,明确 name 属性可用于图标名称或图片链接 - 添加事件列表,明确 click 事件的参数 - 移除英文示例代码中不必要的示例和图标列表 - 优化文档结构和格式,使信息更加清晰 * docs(config-provider): 更新全局配置组件文档 - 调整文档中的强调样式,使用加粗替代下划线 - 完善英文文档缺失的内容,保持和中文文档一致 * docs(component): 更新 Popup 组件文档 - 调整文档结构,优化标题层级 - 添加 v-model 使用示例,明确组件绑定值 - 移除冗余的代码示例,精简文档内容 - 更新属性表格,统一属性描述 - 添加防止滚动穿透的解决方案说明 * docs(resize): ✏️ 更新 resize 组件文档 - 修正事件名称从 `size` 改为 `resize` - 添加组件属性(Attributes)、事件(Events)和插槽(Slots)的详细说明 - 更新文档结构,使其更加完整和易于理解 * docs(transition): ✏️完善Transition 动画组件文档的属性和事件描述 - 增加自定义根节点样式类、懒渲染、动画结束后销毁子节点等属性 - 添加进入和离开过渡的开始、激活和结束状态类 - 新增点击事件和默认插槽 - 更新文档以反映新增功能 * docs(fab): ✏️更新fab组件文档 - 优化了文档结构,调整了部分格式 - 添加了 Methods 和 default Slot 相关的信息 - 更新了 custom-style 属性的命名 * docs(component): ✏️ 更新 Text 组件文档 - 优化文档格式,调整表格结构 - 添加缺失的参数说明和示例代码 - 更新参数类型和默认值 - 增加 call 参数说明 - 补充 Slots 表格 * docs(root-portal): ✏️ 更新组件文档 - 添加 Attributes 和 Events 部分,说明该组件无相关配置 - 修正 Slots 部分的版本信息,统一为 1.11.0 - 更新中文和英文文档
This commit is contained in:
parent
04d0d11849
commit
9132174b11
@ -2,8 +2,6 @@
|
||||
|
||||
悬浮动作按钮组件,按下可显示一组动作按钮。
|
||||
|
||||
|
||||
|
||||
:::warning
|
||||
因为`uni-app`组件无法监听点击自己以外的地方,为了在点击页面其他地方时,可以自动关闭 `fab` ,建议使用组件库的 `useQueue` hook(会关闭所有 dropmenu、popover、toast、swipeAction、fab),在页面的根元素上监听点击事件的冒泡。
|
||||
|
||||
@ -36,14 +34,9 @@
|
||||
import { useToast } from '@/uni_modules/wot-design-uni'
|
||||
const { show: showToast } = useToast()
|
||||
const type = ref<'primary' | 'success' | 'info' | 'warning' | 'error' | 'default'>('primary')
|
||||
const position = ref<'left-top'
|
||||
| 'right-top'
|
||||
| 'left-bottom'
|
||||
| 'right-bottom'
|
||||
| 'left-center'
|
||||
| 'right-center'
|
||||
| 'top-center'
|
||||
| 'bottom-center'>('left-bottom')
|
||||
const position = ref<'left-top' | 'right-top' | 'left-bottom' | 'right-bottom' | 'left-center' | 'right-center' | 'top-center' | 'bottom-center'>(
|
||||
'left-bottom'
|
||||
)
|
||||
const direction = ref<'top' | 'right' | 'bottom' | 'left'>('top')
|
||||
const disabled = ref<boolean>(false)
|
||||
```
|
||||
@ -90,7 +83,6 @@ const active = ref<boolean>(false)
|
||||
|
||||
通过`trigger`插槽自定义触发器,`expandable`控制点击触发器是否展开/收起动作按钮菜单。
|
||||
|
||||
|
||||
```html
|
||||
<wd-fab position="left-bottom" :expandable="false">
|
||||
<template #trigger>
|
||||
@ -98,41 +90,49 @@ const active = ref<boolean>(false)
|
||||
</template>
|
||||
</wd-fab>
|
||||
```
|
||||
|
||||
```ts
|
||||
const handleClick = () => {
|
||||
console.log('点击了')
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## Attributes
|
||||
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
| -------------- | ----------------------------------------------------- | ------------ |-------------------------------------------------------------------------------------------------------------------------------------------| ---------------------------------------------- | ---------------- |
|
||||
| v-model:active | 是否激活 | boolean | - | false | 0.1.57 |
|
||||
| type | 类型 | FabType | 'primary' | 'success' | 'info' | 'warning' | 'error' | 'default' | 'primary' | 0.1.57 |
|
||||
| position | 悬浮按钮位置 | FabPosition | 'left-top' | 'right-top' | 'left-bottom' | 'right-bottom' | left-center | right-center | top-center | bottom-center | 'right-bottom' | 0.1.57 |
|
||||
| draggable | 按钮能否拖动 | boolean | | false | 1.2.19 |
|
||||
| direction | 悬浮按钮菜单弹出方向 | FabDirection | 'top' | 'right' | 'bottom' | 'left' | 'top' | 0.1.57 |
|
||||
| disabled | 是否禁用 | boolean | - | false | 0.1.57 |
|
||||
| inactiveIcon | 悬浮按钮未展开时的图标 | string | - | 'add' | 0.1.57 |
|
||||
| activeIcon | 悬浮按钮展开时的图标 | string | - | 'close' | 0.1.57 |
|
||||
| zIndex | 自定义悬浮按钮层级 | number | - | 99 | 0.1.57 |
|
||||
| gap | 自定义悬浮按钮与可视区域边缘的间距 | FabGap | - | \{ top: 16, left: 16, right: 16, bottom: 16 \} | 1.2.26 |
|
||||
| customStyle | 自定义样式 | string | - | '' | 0.1.57 |
|
||||
| expandable | 用于控制点击时是否展开菜单,设置为 false 时触发 click | boolean | - | true | 1.3.11 |
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
| -------------- | ----------------------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------- | -------- |
|
||||
| v-model:active | 是否激活 | boolean | - | false | 0.1.57 |
|
||||
| type | 类型 | FabType | 'primary' | 'success' | 'info' | 'warning' | 'error' | 'default' | 'primary' | 0.1.57 |
|
||||
| position | 悬浮按钮位置 | FabPosition | 'left-top' | 'right-top' | 'left-bottom' | 'right-bottom' | left-center | right-center | top-center | bottom-center | 'right-bottom' | 0.1.57 |
|
||||
| draggable | 按钮能否拖动 | boolean | | false | 1.2.19 |
|
||||
| direction | 悬浮按钮菜单弹出方向 | FabDirection | 'top' | 'right' | 'bottom' | 'left' | 'top' | 0.1.57 |
|
||||
| disabled | 是否禁用 | boolean | - | false | 0.1.57 |
|
||||
| inactiveIcon | 悬浮按钮未展开时的图标 | string | - | 'add' | 0.1.57 |
|
||||
| activeIcon | 悬浮按钮展开时的图标 | string | - | 'close' | 0.1.57 |
|
||||
| zIndex | 自定义悬浮按钮层级 | number | - | 99 | 0.1.57 |
|
||||
| gap | 自定义悬浮按钮与可视区域边缘的间距 | FabGap | - | \{ top: 16, left: 16, right: 16, bottom: 16 \} | 1.2.26 |
|
||||
| custom-style | 自定义样式 | string | - | '' | 0.1.57 |
|
||||
| expandable | 用于控制点击时是否展开菜单,设置为 false 时触发 click | boolean | - | true | 1.3.11 |
|
||||
|
||||
## Events
|
||||
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
| -------- | -------------------------------------------- | ---- | ---------------- |
|
||||
| click | expandable 设置为 false 时,点击悬浮按钮触发 | — | 1.3.11 |
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
| -------- | -------------------------------------------- | ---- | -------- |
|
||||
| click | expandable 设置为 false 时,点击悬浮按钮触发 | — | 1.3.11 |
|
||||
|
||||
## Methods
|
||||
|
||||
| 方法名 | 说明 | 参数 | 最低版本 |
|
||||
| ------ | -------- | ---- | -------- |
|
||||
| open | 展开菜单 | - | 0.1.57 |
|
||||
| close | 收起菜单 | - | 0.1.57 |
|
||||
|
||||
## Slot
|
||||
|
||||
| name | 说明 | 最低版本 |
|
||||
| ------- | -------------------------------------------------------------- | ---------------- |
|
||||
| trigger | 触发器插槽,用于自定义点击按钮,使用此插槽时组件不会抛出 click | 1.3.11 |
|
||||
| name | 说明 | 最低版本 |
|
||||
| ------- | -------------------------------------------------------------- | -------- |
|
||||
| default | 动作按钮,通常放置多个按钮 | 0.1.57 |
|
||||
| trigger | 触发器插槽,用于自定义点击按钮,使用此插槽时组件不会抛出 click | 1.3.11 |
|
||||
|
||||
## 外部样式类
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
# Resize 监听元素尺寸变化
|
||||
|
||||
当组件包裹的文档流尺寸发生变化时,触发 `size` 事件。一般用于监听 dom 内容更新时导致的 dom 尺寸位置的变化,重新获取 dom 尺寸和位置,进行内容展示的计算操作。
|
||||
当组件包裹的文档流尺寸发生变化时,触发 `resize` 事件。一般用于监听 dom 内容更新时导致的 dom 尺寸位置的变化,重新获取 dom 尺寸和位置,进行内容展示的计算操作。
|
||||
|
||||
|
||||
## 基本用法
|
||||
@ -30,8 +30,22 @@ function handleResize(detail: Record<string, string | number>) {
|
||||
}
|
||||
```
|
||||
|
||||
## Attributes
|
||||
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
|-----|------|-----|-------|--------|---------|
|
||||
| custom-style | 自定义根节点样式 | string | - | - | - |
|
||||
| custom-class | 自定义根节点样式类 | string | - | - | - |
|
||||
| custom-container-class | 自定义容器样式类 | string | - | - | - |
|
||||
|
||||
## Events
|
||||
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
|--------|------|-----|---------|
|
||||
| resize | 尺寸发生变化时触发 | `{width: number, height: number, top: number, right: number, bottom: number, left: number}` | - |
|
||||
|
||||
## Slots
|
||||
|
||||
| 插槽名称 | 说明 | 最低版本 |
|
||||
|---------|------|---------|
|
||||
| default | 需要监听尺寸变化的内容 | - |
|
||||
|
||||
@ -56,9 +56,16 @@ version: 1.11.0
|
||||
}
|
||||
```
|
||||
|
||||
## Attributes
|
||||
|
||||
该组件无属性配置。
|
||||
|
||||
## Events
|
||||
|
||||
该组件无事件。
|
||||
|
||||
## Slots
|
||||
|
||||
| 名称 | 说明 | 最低版本 |
|
||||
| ------- | ---------------------------- | -------- |
|
||||
| default | 默认插槽,用于渲染传送内容 | - |
|
||||
| default | 默认插槽,用于渲染传送内容 | 1.11.0 |
|
||||
@ -71,7 +71,7 @@
|
||||
|
||||
## lines
|
||||
|
||||
设置 `lines` 属性,文本显示的行数,如果设置,超出此行数,将会显示省略号。最大值为5。
|
||||
设置 `lines` 属性,文本显示的行数,如果设置,超出此行数,将会显示省略号。最大值为 5。
|
||||
|
||||
```html
|
||||
<wd-text :text="text" :lines="2" size="16px"></wd-text>
|
||||
@ -90,14 +90,7 @@
|
||||
设置 `prefix` `suffix` 插槽。
|
||||
|
||||
```html
|
||||
<wd-text
|
||||
text="12345678901"
|
||||
mode="phone"
|
||||
format
|
||||
type="primary"
|
||||
prefix="Prefix"
|
||||
suffix="Suffix"
|
||||
/>
|
||||
<wd-text text="12345678901" mode="phone" format type="primary" prefix="Prefix" suffix="Suffix" />
|
||||
|
||||
<wd-text text="12345678901" mode="phone" format type="primary">
|
||||
<template #prefix>
|
||||
@ -112,13 +105,7 @@
|
||||
设置 `mode="price"` 。
|
||||
|
||||
```html
|
||||
<wd-text
|
||||
text="16354.156"
|
||||
mode="price"
|
||||
type="success"
|
||||
decoration="line-through"
|
||||
prefix="¥"
|
||||
/>
|
||||
<wd-text text="16354.156" mode="price" type="success" decoration="line-through" prefix="¥" />
|
||||
```
|
||||
|
||||
## 文字装饰
|
||||
@ -126,7 +113,7 @@
|
||||
设置 `decoration` 文字装饰,下划线,中划线等。
|
||||
|
||||
```html
|
||||
<wd-text :text="text" type="warning" decoration="underline"/>
|
||||
<wd-text :text="text" type="warning" decoration="underline" />
|
||||
```
|
||||
|
||||
## 事件
|
||||
@ -146,32 +133,38 @@ function clickTest() {
|
||||
|
||||
## Attributes
|
||||
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
| ---------- | ------------------------------------------------------------------ | ------- | ------------------------------------------------------------------ | ------- | ---------------- |
|
||||
| type | 主题类型 | string | 'primary' / 'error' / 'warning' / 'success' | default | 1.3.4 |
|
||||
| text | 文字 | string / number | - | | 1.3.4 |
|
||||
| size | 字体大小 | string | - | - | 1.3.4 |
|
||||
| mode | 文本处理的匹配模式 | string | 'text-普通文本' / 'date - 日期' / 'phone - 手机号' / 'name - 姓名' / 'price - 金额' | text | 1.3.4+ |
|
||||
| bold | 是否粗体,默认 normal | boolean | - | false | 1.3.4 |
|
||||
| format | 是否脱敏 | boolean | 当 mode 为 phone 和 name 时生效 | false | 1.3.4 |
|
||||
| color | 文字颜色 | string | - | - | 1.3.4 |
|
||||
| lines | 文本显示的行数,如果设置,超出此行数,将会显示省略号。最大值为 5。 | Number | - | - | 1.3.4 |
|
||||
| lineHeight | 文本行高 | string | - | | 1.3.4 |
|
||||
| decoration | 文字装饰,下划线,中划线等 | string | underline/line-through/overline | | 1.3.4+ |
|
||||
| prefix | 前置插槽 | string | - | | 1.3.4+ |
|
||||
| suffix | 后置插槽 | string | - | | 1.3.4+ |
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
| ---------- | ------------------------------------------------------------------ | --------------- | ------------------------------------------------------- | ------- | -------- |
|
||||
| type | 主题类型 | string | 'primary' / 'error' / 'warning' / 'success' / 'default' | default | 1.3.4 |
|
||||
| text | 文字 | string / number | - | - | 1.3.4 |
|
||||
| size | 字体大小 | string | - | - | 1.3.4 |
|
||||
| mode | 文本处理的匹配模式 | string | 'text' / 'date' / 'phone' / 'name' / 'price' | text | 1.3.4+ |
|
||||
| bold | 是否粗体,默认 normal | boolean | - | false | 1.3.4 |
|
||||
| format | 是否脱敏 | boolean | 当 mode 为 phone 和 name 时生效 | false | 1.3.4 |
|
||||
| color | 文字颜色 | string | - | - | 1.3.4 |
|
||||
| lines | 文本显示的行数,如果设置,超出此行数,将会显示省略号。最大值为 5。 | number | - | - | 1.3.4 |
|
||||
| lineHeight | 文本行高 | string | - | - | 1.3.4 |
|
||||
| decoration | 文字装饰,下划线,中划线等 | string | 'underline' / 'line-through' / 'overline' | none | 1.3.4+ |
|
||||
| prefix | 前置内容 | string | - | - | 1.3.4+ |
|
||||
| suffix | 后置内容 | string | - | - | 1.3.4+ |
|
||||
| call | mode=phone 时,点击文本是否拨打电话 | boolean | - | false | 1.3.4 |
|
||||
|
||||
## Events
|
||||
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
| -------- | -------------- | ----- | ---------------- |
|
||||
| click | 标签点击时触发 | event | 1.3.4 |
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
| -------- | -------------- | ----- | -------- |
|
||||
| click | 标签点击时触发 | event | 1.3.4 |
|
||||
|
||||
## Slots
|
||||
|
||||
| 插槽名称 | 说明 | 最低版本 |
|
||||
| -------- | -------- | -------- |
|
||||
| prefix | 前置插槽 | 1.3.4 |
|
||||
| suffix | 后置插槽 | 1.3.4 |
|
||||
|
||||
## 外部样式类
|
||||
|
||||
| 类名 | 说明 | 最低版本 |
|
||||
| ------------ | ---------- | ---------------- |
|
||||
| custom-class | 根节点样式 | 1.3.4 |
|
||||
| custom-style | 根节点样式 | 1.3.4 |
|
||||
| 类名 | 说明 | 最低版本 |
|
||||
| ------------ | ---------- | -------- |
|
||||
| custom-class | 根节点样式 | 1.3.4 |
|
||||
| custom-style | 根节点样式 | 1.3.4 |
|
||||
|
||||
@ -77,9 +77,18 @@
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|
||||
|--------------|--------------|------------------|----------------|---------|----------|
|
||||
| show | 是否展示组件 | boolean | - | - | - |
|
||||
| name | 动画类型 | string | `TransitionName` | - | - |
|
||||
| duration | 动画执行时间 | number / boolean | - | 300(ms) | - |
|
||||
| name | 动画类型 | string / array | `TransitionName` | - | - |
|
||||
| duration | 动画执行时间 | number / object / boolean | - | 300(ms) | - |
|
||||
| custom-style | 自定义样式 | string | - | - | - |
|
||||
| custom-class | 自定义根节点样式类 | string | - | - | - |
|
||||
| lazy-render | 弹层内容懒渲染 | boolean | - | false | - |
|
||||
| destroy | 是否在动画结束时销毁子节点 | boolean | - | true | - |
|
||||
| enter-class | 进入过渡的开始状态 | string | - | - | - |
|
||||
| enter-active-class | 进入过渡的激活状态 | string | - | - | - |
|
||||
| enter-to-class | 进入过渡的结束状态 | string | - | - | - |
|
||||
| leave-class | 离开过渡的开始状态 | string | - | - | - |
|
||||
| leave-active-class | 离开过渡的激活状态 | string | - | - | - |
|
||||
| leave-to-class | 离开过渡的结束状态 | string | - | - | - |
|
||||
| disable-touch-move | 是否阻止触摸滚动 | boolean | - | false | 1.11.0 |
|
||||
|
||||
### TransitionName 动画类型
|
||||
@ -103,12 +112,19 @@
|
||||
|
||||
| 事件名称 | 说明 | 参数 | 最低版本 |
|
||||
| ---------------- | ---------- | ---- | -------- |
|
||||
| beforeenter | 进入前触发 | - | - |
|
||||
| before-enter | 进入前触发 | - | - |
|
||||
| enter | 进入时触发 | - | - |
|
||||
| afterenter | 进入后触发 | - | - |
|
||||
| beforeleave | 离开前触发 | - | - |
|
||||
| after-enter | 进入后触发 | - | - |
|
||||
| before-leave | 离开前触发 | - | - |
|
||||
| leave | 离开时触发 | - | - |
|
||||
| afterleave | 离开后触发 | - | - |
|
||||
| after-leave | 离开后触发 | - | - |
|
||||
| click | 点击时触发 | - | - |
|
||||
|
||||
## Slots
|
||||
|
||||
| 插槽名称 | 说明 | 最低版本 |
|
||||
|---------|------|---------|
|
||||
| default | 需要应用动画效果的内容 | - |
|
||||
|
||||
## 外部样式类
|
||||
|
||||
|
||||
@ -115,7 +115,7 @@ const handleClick = () => {
|
||||
| activeIcon | Icon when floating button is expanded | string | - | 'close' | 0.1.57 |
|
||||
| zIndex | Custom floating button layer level | number | - | 99 | 0.1.57 |
|
||||
| gap | Custom gap between floating button and viewport edges | FabGap | - | \{ top: 16, left: 16, right: 16, bottom: 16 \} | 1.2.26 |
|
||||
| customStyle | Custom style | string | - | '' | 0.1.57 |
|
||||
| custom-style | Custom style | string | - | '' | 0.1.57 |
|
||||
| expandable | Controls whether to expand menu when clicked, triggers click when set to false | boolean | - | true | 1.3.11 |
|
||||
|
||||
## Events
|
||||
@ -124,10 +124,18 @@ const handleClick = () => {
|
||||
|------------|----------------------------------------------------------------|------------|----------|
|
||||
| click | Triggered when clicking the floating button when expandable is false | — | 1.3.11 |
|
||||
|
||||
## Methods
|
||||
|
||||
| Method Name | Description | Parameters | Version |
|
||||
|-------------|-------------|------------|----------|
|
||||
| open | Expand menu | - | 0.1.57 |
|
||||
| close | Collapse menu | - | 0.1.57 |
|
||||
|
||||
## Slot
|
||||
|
||||
| name | Description | Version |
|
||||
|---------|------------------------------------------------------------------------------------------------------------|----------|
|
||||
| default | Action buttons, usually contains multiple buttons | 0.1.57 |
|
||||
| trigger | Trigger slot, used for custom click button, component won't emit click when using this slot | 1.3.11 |
|
||||
|
||||
## External Classes
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
# Resize
|
||||
|
||||
When the size of the document flow wrapped by the component changes, it triggers the `size` event. Generally used to monitor changes in DOM dimensions and positions caused by DOM content updates, re-acquire DOM dimensions and positions, and perform calculations for content display.
|
||||
When the size of the document flow wrapped by the component changes, it triggers the `resize` event. Generally used to monitor changes in DOM dimensions and positions caused by DOM content updates, re-acquire DOM dimensions and positions, and perform calculations for content display.
|
||||
|
||||
## Basic Usage
|
||||
|
||||
@ -29,8 +29,22 @@ function handleResize(detail: Record<string, string | number>) {
|
||||
}
|
||||
```
|
||||
|
||||
## Attributes
|
||||
|
||||
| Parameter | Description | Type | Optional Values | Default | Version |
|
||||
| ---------------------- | ---------------------------- | ------ | --------------- | ------- | ------- |
|
||||
| custom-style | Custom root node style | string | - | - | - |
|
||||
| custom-class | Custom root node style class | string | - | - | - |
|
||||
| custom-container-class | Custom container style class | string | - | - | - |
|
||||
|
||||
## Events
|
||||
|
||||
| Event Name | Description | Parameters | Version |
|
||||
|------------|-------------|------------|----------|
|
||||
| resize | Triggered when size changes | `{width: number, height: number, top: number, right: number, bottom: number, left: number}` | - |
|
||||
| Event Name | Description | Parameters | Version |
|
||||
| ---------- | --------------------------- | ------------------------------------------------------------------------------------------- | ------- |
|
||||
| resize | Triggered when size changes | `{width: number, height: number, top: number, right: number, bottom: number, left: number}` | - |
|
||||
|
||||
## Slots
|
||||
|
||||
| Slot Name | Description | Version |
|
||||
| --------- | ----------------------------------- | ------- |
|
||||
| default | Content to monitor for size changes | - |
|
||||
|
||||
@ -54,8 +54,16 @@ Use `wd-root-portal` to render content to the root node, avoiding style interfer
|
||||
}
|
||||
```
|
||||
|
||||
## Attributes
|
||||
|
||||
This component has no attribute configuration.
|
||||
|
||||
## Events
|
||||
|
||||
This component has no events.
|
||||
|
||||
## Slots
|
||||
|
||||
| Name | Description | Version |
|
||||
| ------- | ------------------------------ | ------- |
|
||||
| default | Default slot for portal content | - |
|
||||
| default | Default slot for portal content | 1.11.0 |
|
||||
@ -148,18 +148,19 @@ function clickTest() {
|
||||
|
||||
| Parameter | Description | Type | Options | Default | Version |
|
||||
|-----------|-------------|------|----------|---------|----------|
|
||||
| type | Theme type | string | 'primary' / 'error' / 'warning' / 'success' | default | 1.3.4 |
|
||||
| text | Text content | string / number | - | | 1.3.4 |
|
||||
| type | Theme type | string | 'primary' / 'error' / 'warning' / 'success' / 'default' | default | 1.3.4 |
|
||||
| text | Text content | string / number | - | - | 1.3.4 |
|
||||
| size | Font size | string | - | - | 1.3.4 |
|
||||
| mode | Text processing mode | string | 'text-normal text' / 'date' / 'phone' / 'name' / 'price' | text | 1.3.4+ |
|
||||
| mode | Text processing mode | string | 'text' / 'date' / 'phone' / 'name' / 'price' | text | 1.3.4+ |
|
||||
| bold | Whether bold, default normal | boolean | - | false | 1.3.4 |
|
||||
| format | Whether to mask data | boolean | Effective when mode is phone or name | false | 1.3.4 |
|
||||
| color | Text color | string | - | - | 1.3.4 |
|
||||
| lines | Number of lines to display, if set, ellipsis will show when exceeding. Max value is 5. | Number | - | - | 1.3.4 |
|
||||
| lineHeight | Text line height | string | - | | 1.3.4 |
|
||||
| decoration | Text decoration, underline, line-through, etc. | string | underline/line-through/overline | | 1.3.4+ |
|
||||
| prefix | Prefix slot | string | - | | 1.3.4+ |
|
||||
| suffix | Suffix slot | string | - | | 1.3.4+ |
|
||||
| lines | Number of lines to display, if set, ellipsis will show when exceeding. Max value is 5. | number | - | - | 1.3.4 |
|
||||
| lineHeight | Text line height | string | - | - | 1.3.4 |
|
||||
| decoration | Text decoration, underline, line-through, etc. | string | 'underline' / 'line-through' / 'overline' | none | 1.3.4+ |
|
||||
| prefix | Prefix content | string | - | - | 1.3.4+ |
|
||||
| suffix | Suffix content | string | - | - | 1.3.4+ |
|
||||
| call | Whether to make a call when clicking text in phone mode | boolean | - | false | 1.3.4 |
|
||||
|
||||
## Events
|
||||
|
||||
@ -169,6 +170,11 @@ function clickTest() {
|
||||
|
||||
## Slots
|
||||
|
||||
| Slot Name | Description | Version |
|
||||
|-----------|-------------|---------|
|
||||
| prefix | Prefix slot | 1.3.4 |
|
||||
| suffix | Suffix slot | 1.3.4 |
|
||||
|
||||
## External Classes
|
||||
|
||||
| Class Name | Description | Version |
|
||||
|
||||
@ -77,9 +77,18 @@ When the animation leaves, the tag will be set with `leave-class` and `leave-act
|
||||
| Parameter | Description | Type | Optional Values | Default Value | Minimum Version |
|
||||
|--------------------|------------------------------------|------------------|------------------|---------------|------------------|
|
||||
| show | Whether to display the component | boolean | - | - | - |
|
||||
| name | Animation type | string | `TransitionName` | - | - |
|
||||
| duration | Animation duration | number / boolean | - | 300(ms) | - |
|
||||
| name | Animation type | string / array | `TransitionName` | - | - |
|
||||
| duration | Animation duration | number / object / boolean | - | 300(ms) | - |
|
||||
| custom-style | Custom styles | string | - | - | - |
|
||||
| custom-class | Custom root node style class | string | - | - | - |
|
||||
| lazy-render | Lazy render content | boolean | - | false | - |
|
||||
| destroy | Whether to destroy child nodes after animation ends | boolean | - | true | - |
|
||||
| enter-class | Starting state of enter transition | string | - | - | - |
|
||||
| enter-active-class | Active state of enter transition | string | - | - | - |
|
||||
| enter-to-class | Ending state of enter transition | string | - | - | - |
|
||||
| leave-class | Starting state of leave transition | string | - | - | - |
|
||||
| leave-active-class | Active state of leave transition | string | - | - | - |
|
||||
| leave-to-class | Ending state of leave transition | string | - | - | - |
|
||||
| disable-touch-move | Whether to prevent touch scrolling | boolean | - | false | 1.11.0 |
|
||||
|
||||
### TransitionName Animation Types
|
||||
@ -102,12 +111,19 @@ When the animation leaves, the tag will be set with `leave-class` and `leave-act
|
||||
|
||||
| Event Name | Description | Parameters | Version |
|
||||
|------------|-------------|------------|----------|
|
||||
| beforeenter | Triggered before enter | - | - |
|
||||
| before-enter | Triggered before enter | - | - |
|
||||
| enter | Triggered during enter | - | - |
|
||||
| afterenter | Triggered after enter | - | - |
|
||||
| beforeleave | Triggered before leave | - | - |
|
||||
| after-enter | Triggered after enter | - | - |
|
||||
| before-leave | Triggered before leave | - | - |
|
||||
| leave | Triggered during leave | - | - |
|
||||
| afterleave | Triggered after leave | - | - |
|
||||
| after-leave | Triggered after leave | - | - |
|
||||
| click | Triggered when clicked | - | - |
|
||||
|
||||
## Slots
|
||||
|
||||
| Slot Name | Description | Version |
|
||||
|-----------|-------------|---------|
|
||||
| default | Content to apply animation effects | - |
|
||||
|
||||
## External Style Classes
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user