57 lines
1.1 KiB
Markdown
57 lines
1.1 KiB
Markdown
|
# Loading <small>加载</small>
|
||
|
|
|
||
|
|
## 示例
|
||
|
|
|
||
|
|
### 风格
|
||
|
|
|
||
|
|
可选的风格 `ui` 属性值：`normal`/`strong`/`reverse`。
|
||
|
|
|
||
|
|
[[demo src="/demo/loading/style.vue"]]
|
||
|
|
|
||
|
|
### 尺寸
|
||
|
|
|
||
|
|
可选的尺寸 `ui` 属性值：`s`/`m`/`l`。
|
||
|
|
|
||
|
|
[[demo src="/demo/loading/size.vue"]]
|
||
|
|
|
||
|
|
### 排列方式
|
||
|
|
|
||
|
|
可选的排列方式 `ui` 属性值：`vertical`。
|
||
|
|
|
||
|
|
[[demo src="/demo/loading/layout.vue"]]
|
||
|
|
|
||
|
|
### 自定义加载图标
|
||
|
|
|
||
|
|
通过 `spinner` 插槽设置自定义加载图标。
|
||
|
|
|
||
|
|
[[demo src="/demo/loading/slot.vue"]]
|
||
|
|
|
||
|
|
## API
|
||
|
|
|
||
|
|
| 名称 | 类型 | 默认值 | 描述 |
|
||
|
|
| -- | -- | -- | -- |
|
||
|
|
| `ui` | `string=` | `normal` `m` | [^ui] |
|
||
|
|
| `loading` | `boolean` | `false` | 是否处于加载状态。 |
|
||
|
|
|
||
|
|
^^^ui
|
||
|
|
预设样式。为空格分隔的一组枚举值的组合。
|
||
|
|
|
||
|
|
+++枚举值
|
||
|
|
| 值 | 描述 |
|
||
|
|
| -- | -- |
|
||
|
|
| `strong` | 加强样式。 |
|
||
|
|
| `reverse` | 反白样式，用于深色背景。 |
|
||
|
|
| `vertical` | 垂直排列样式。|
|
||
|
|
| `s` | 小尺寸样式。 |
|
||
|
|
| `m` | 中尺寸样式。 |
|
||
|
|
| `l` | 大尺寸样式。 |
|
||
|
|
+++
|
||
|
|
^^^
|
||
|
|
|
||
|
|
### 插槽
|
||
|
|
|
||
|
|
| 名称 | 描述 |
|
||
|
|
| -- | -- |
|
||
|
|
| `spinner` | 加载图标。 |
|
||
|
|
| `default` | 加载中提示文字。 |
|