loading.md 1.21 KB

Loading 加载

fe2e253f358f08f97cb9e1a5ec7df01f3c9bc3e1/examples/views/docs/component/loading.md#">加载类型

::: snippet 设置type改变加载类型,默认为circular

<template>
  <div>
    <zui-loading type="circular"></zui-loading>
    <zui-loading type="spinner"></zui-loading>
  </div>
</template>

:::

fe2e253f358f08f97cb9e1a5ec7df01f3c9bc3e1/examples/views/docs/component/loading.md#">颜色

::: snippet 设置color改变颜色

<template>
  <div>
    <zui-loading color="red"></zui-loading>
    <zui-loading color="deepskyblue" type="spinner"></zui-loading>
  </div>
</template>

:::

fe2e253f358f08f97cb9e1a5ec7df01f3c9bc3e1/examples/views/docs/component/loading.md#">大小

::: snippet 设置size改变大小

<template>
  <div>
    <zui-loading color="deepskyblue"></zui-loading>
    <zui-loading size="3rem" color="red"></zui-loading>
  </div>
</template>

:::

fe2e253f358f08f97cb9e1a5ec7df01f3c9bc3e1/examples/views/docs/component/loading.md#">加载文案

可以设置任意类型的加载文案

::: snippet 设置vertical改变为垂直布局

<template>
  <div>
    <zui-loading>加载中...</zui-loading>
    <zui-loading vertical>加载中...</zui-loading>
  </div>
</template>

:::

API

Attribute 属性

参数|说明|类型|可选值|默认值 -|-|-|-|- type | 类型 | String | - | circular color | 颜色 | String | - | - size | 大小 | Number,String | - | 2rem vertical | 垂直 | Boolean | true,false | false textSize | 文本大小 | Number,String | - | -