k progress

一个 Vue 插件，线性进度条。A Vue plugin, linear progress bar.

xrkffgg
33
6
Vue

🌈 k-progress

一个 Vue 插件，线性进度条。






English | 简体中文

🎉 Vue3

k-progress 现已支持 vue3，你可以来这里查看 k-progress-v3。

这个项目不再维护。谢谢！

📚 教 程

k-progress

📦 安 装

npm install -S k-progress
# or
yarn add k-progress

🔨 开始使用

// main.js
import KProgress from 'k-progress';
Vue.component('k-progress', KProgress);

📔 参 数

参 数 类 型 默认值 可选值 说 明
percent Number 0 0-100 百分比（必填）
line-height Number 6 进度条高度
type String line line / lump 进度条类型
status String success / warning / error 进度条状态
color String / Array / Function 进度条颜色；当使用Array时，限制个数为 6；当使用 Function 时，参数为 percent
color-flow Boolean false 是否开启颜色流动
flow-second Number 5 1-6 流动所需时间，即时间越小，速度越快
bg-color String #ebeef5 颜色代码 进度条背景颜色
border Boolean true 是否圆弧
show-text Boolean true 是否显示进度条文字
format Function 自定义文字显示，参数为 percent
cut-width Number 1 lump 宽度
cut-color String #ebeef5 颜色代码 lump 颜色
active Boolean false 是否开启动效
active-color String 动效颜色

📒 更新日志

更新日志

🖊 欢 迎

感谢您的使用，若您发现问题任何问题，欢迎指正！

LICENSE

MIT