{"id":15650877,"url":"https://github.com/xrkffgg/k-progress","last_synced_at":"2025-04-30T15:50:11.644Z","repository":{"id":47728025,"uuid":"227731022","full_name":"xrkffgg/k-progress","owner":"xrkffgg","description":"一个 Vue 插件，线性进度条。A Vue plugin, linear progress bar.","archived":false,"fork":false,"pushed_at":"2020-11-06T03:23:56.000Z","size":287,"stargazers_count":33,"open_issues_count":0,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-30T15:49:59.201Z","etag":null,"topics":["components","javascript","progress-bar","vue","vue-plugin"],"latest_commit_sha":null,"homepage":"https://xrkffgg.github.io/Knotes/course/k-progress.html","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xrkffgg.png","metadata":{"files":{"readme":"README-CN.md","changelog":"CHANGELOG-CN.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-12-13T01:37:47.000Z","updated_at":"2024-11-16T03:02:47.000Z","dependencies_parsed_at":"2022-09-18T03:32:31.017Z","dependency_job_id":null,"html_url":"https://github.com/xrkffgg/k-progress","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xrkffgg%2Fk-progress","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xrkffgg%2Fk-progress/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xrkffgg%2Fk-progress/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xrkffgg%2Fk-progress/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xrkffgg","download_url":"https://codeload.github.com/xrkffgg/k-progress/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251734542,"owners_count":21635155,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["components","javascript","progress-bar","vue","vue-plugin"],"created_at":"2024-10-03T12:36:10.064Z","updated_at":"2025-04-30T15:50:11.618Z","avatar_url":"https://github.com/xrkffgg.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🌈 k-progress\n\n\u003e 一个 Vue 插件，线性进度条。\n\n![](https://img.shields.io/npm/v/k-progress?color=success\u0026style=flat-square)\n![](https://img.shields.io/github/languages/top/xrkffgg/k-progress?style=flat-square)\n![](https://img.shields.io/github/languages/code-size/xrkffgg/k-progress?color=orange\u0026style=flat-square)\n![](https://img.shields.io/github/stars/xrkffgg/k-progress?color=blueviolet\u0026style=flat-square)\n![](https://img.shields.io/github/license/xrkffgg/k-progress?color=red\u0026style=flat-square)\n![](https://img.shields.io/npm/dt/k-progress?color=ff69b4\u0026style=flat-square)\n\n[English](./README.md) | 简体中文\n\n## 🎉 Vue3\n\n`k-progress` 现已支持 vue3，你可以来这里查看 [`k-progress-v3`](https://github.com/xrkffgg/k-progress-v3)。\n\n这个项目不再维护。谢谢！\n\n## 📚 教 程\n[k-progress](https://xrkffgg.github.io/Knotes/course/k-progress.html)\n\n## 📦 安 装\n```bash\nnpm install -S k-progress\n# or\nyarn add k-progress\n```\n\n## 🔨 开始使用\n```js\n// main.js\nimport KProgress from 'k-progress';\nVue.component('k-progress', KProgress);\n```\n## 📔 参 数\n|    参 数     |           类 型           |  默认值   |             可选值              |                                       说 明                                       |\n| :----------: | :-----------------------: | :-------: | :-----------------------------: | :-------------------------------------------------------------------------------: |\n|   percent    |          Number           |     0     |              0-100              |                                  百分比（必填）                                   |\n| line-height  |          Number           |     6     |                                 |                                    进度条高度                                     |\n|     type     |          String           |  `line`   |         `line` / `lump`         |                                    进度条类型                                     |\n|    status    |          String           |           | `success` / `warning` / `error` |                                    进度条状态                                     |\n|    color     | String / Array / Function |           |                                 | 进度条颜色；当使用`Array`时，限制个数为 6；当使用 `Function` 时，参数为 `percent` |\n|  color-flow  |          Boolean          |  `false`  |                                 |                                 是否开启颜色流动                                  |\n| flow-second  |          Number           |     5     |               1-6               |                        流动所需时间，即时间越小，速度越快                         |\n|   bg-color   |          String           | `#ebeef5` |            颜色代码             |                                  进度条背景颜色                                   |\n|    border    |          Boolean          |  `true`   |                                 |                                     是否圆弧                                      |\n|  show-text   |          Boolean          |  `true`   |                                 |                                是否显示进度条文字                                 |\n|    format    |         Function          |           |                                 |                         自定义文字显示，参数为 `percent`                          |\n|  cut-width   |          Number           |     1     |                                 |                                    `lump` 宽度                                    |\n|  cut-color   |          String           | `#ebeef5` |            颜色代码             |                                    `lump` 颜色                                    |\n|    active    |          Boolean          |  `false`  |                                 |                                   是否开启动效                                    |\n| active-color |          String           |           |                                 |                                     动效颜色                                      |\n\n## 📒 更新日志\n[更新日志](./CHANGELOG-CN.md)\n\n## 🖊 欢 迎\n感谢您的使用，若您发现问题任何问题，欢迎指正！ \n- [Issues](https://github.com/xrkffgg/k-progress/issues) \n- [PR](https://github.com/xrkffgg/k-progress/pulls)\n\n## LICENSE\n[MIT](https://github.com/xrkffgg/k-progress/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxrkffgg%2Fk-progress","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxrkffgg%2Fk-progress","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxrkffgg%2Fk-progress/lists"}