zh-commons
Version:
47 lines (37 loc) • 990 B
Markdown
# zh-loading
> 绚丽 vue loading 组件
## vue 组件库 zh-commons 地址
[https://github.com/zonghua2016/zh-commons](https://github.com/zonghua2016/zh-commons)
## 1. Install
```js
npm install zh-commons
```
or
```js
yarn add zh-commons
```
## 2. Quick Start
1.引入 `zh-loading` 组件
```js
import { ZhLoading } from 'zh-loading';
```
2.在vue组件中使用
```html
<template>
<div>
<ZhLoading />
</div>
</template>
```
3. 参考参数
| 参数名称 | 默认值 | 说明 |
|:---------:|:-----:|---------------|
| size | 200 | 加载图的整体大小 |
| cicleNum | 6 | 圆圈个数 |
|borderWidth| 6 | 圆圈宽度 |
| colors |`['#629', '#c28', '#e25', '#f53', '#fb2', '#8c4', '#0a9', '#17b']`|圆圈颜色|
- 以上参数可自由组合,效果自由搭配 😂
## 3. Example
``` html
<ZhLoading :size="80" :cicleNum="4" :borderWidth="3" :colors="['#fb2', '#8c4', '#0a9', '#17b']" />
```