# loading (w-loading)

- **Import**: `WLoading` from `win-design-next`
- **Tag**: `<w-loading>`
- **说明**: Loading 加载
- **分类**: feedback
- **Skill 版本**: V1.1.0
- **适配组件库**: win-design-next 1.2.2
- **API 来源**: `docs/zh-CN/component/loading.md`

## API

## API

### 配置项

| 名称        | 说明                                                                                                                                         | 类型                       | 默认          |
| ----------- | -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------- | ------------- |
| target      | Loading 需要覆盖的 DOM 节点。 可传入一个 DOM 对象或字符串； 若传入字符串，则会将其作为参数传入 `document.querySelector`以获取到对应 DOM 节点 | ^[string] / ^[HTMLElement] | document.body |
| body        | 同 `v-loading` 指令中的 `body` 修饰符                                                                                                        | ^[boolean]                 | false         |
| fullscreen  | 同 `v-loading` 指令中的 `fullscreen` 修饰符                                                                                                  | ^[boolean]                 | true          |
| lock        | 同 `v-loading` 指令中的 `lock` 修饰符                                                                                                        | ^[boolean]                 | false         |
| text        | 显示在加载图标下方的加载文案                                                                                                                 | ^[string]                  | —             |
| spinner     | 自定义加载图标类名                                                                                                                           | ^[string]                  | —             |
| background  | 遮罩背景色                                                                                                                                   | ^[string]                  | —             |
| customClass | Loading 的自定义类名                                                                                                                         | ^[string]                  | —             |
| svg         | 自定义 SVG 元素覆盖默认加载器                                                                                                                | ^[string]                  | —             |
| svgViewBox  | 设置用于加载 svg 元素的 viewBox 属性                                                                                                         | ^[string]                  | —             |
| beforeClose | Loading 关闭之前执行的函数。 如果此函数返回 false ，关闭过程将被中止。 反之，loading 将被关闭。                                              | ^[Function]`() => boolean` | —             |
| closed      | Loading 完全关闭后触发的函数                                                                                                                 | ^[Function]`() => void`    | —             |

### 指令

| 名称                     | 说明                                         | 类型                           |
| ------------------------ | -------------------------------------------- | ------------------------------ |
| v-loading                | 是否显示动画                                 | ^[boolean] / ^[LoadingOptions] |
| win-loading-text         | 显示在加载图标下方的加载文案                 | ^[string]                      |
| win-loading-spinner      | 自定义加载图标                               | ^[string]                      |
| win-loading-svg          | 自定义加载图标 (与 win-loading-spinner 相同) | ^[string]                      |
| win-loading-svg-view-box | 设置用于加载 svg 元素的 viewBox 属性         | ^[string]                      |
| win-loading-background   | 背景遮罩的颜色                               | ^[string]                      |
| win-loading-custom-class | loading 的自定义类名                         | ^[string]                      |
