H5W3
当前位置:H5W3 > 其他技术问题 > 正文

【前端技术】推荐 8 个漂亮的 vue.js 进度条组件

翻译:疯狂的技术宅

原文:https://jquerypluginsfree.com…

为大家精心挑选了 8 个漂亮的 Progress Bars 组件,并附上 GitHub 链接和 vue.js 代码示例。

1.easy-circular-progress

一个简单的循环进度组件,带有计数效果。

easy-circular-progress.jpg

作者:dreambo8563

Github:https://github.com/dreambo856…


2.vuejs-progress-bar

vue.js 专用的 ProgressBar,基于SVG 矢量图形。有直线、圆和圆柱 3 种模式:

progressbar.gif

作者:larsmars

Github:https://github.com/larsmars/v…


3.Vue Spinner Component

可自定义的轻量级旋转器图标组件。

你可以通过设置其属性来自定义颜色、大小、深度、旋转方向和速度等。所有的属性均具有默认值。你可以通过设置其状态来控制它的显示或隐藏。

Customize-and-lightweight-Spinner-Component-for-vue.gif

Github:/wp-content/uploads/aaacj/20210503vue1234/bVbFRpL alt=examples2963.png” title=”examples.png”>

Github:https://github.com/snirp/vue-…


5.vue-simple-progress

简单灵活的进度条。vue-simple-progress 设计为轻量级的 Vue.js 进度条,只需要很少的配置就能使用。

vue-simple-progress.jpg

Github:https://github.com/dzwillia/v…


6.vue-wait

Vue 和 Vuex 可用的多进程加载进度管理。该项目以前名为 vuex-loading。

vue-wait 能够帮你管理页面上的多个加载状态,而不会发生任何冲突。它基于一个“非常简单的想法”,可以管理具有多个加载状态的阵列(或可选的 Vuex 存储)。通过内置的加载组件侦听其注册的 loader 即可立即变为加载状态。

Apr-10-2020 16-07-22.gif

Github:/wp-content/uploads/aaacj/20210503vue1234/bVbFRqu alt=Spinner-Component-for-vue2964.gif” title=”Spinner-Component-for-vue.gif”>

Github:/wp-content/uploads/aaacj/20210503vue1234/bVbFRqx alt=loadingvue2965.gif” title=”loadingvue.gif”>

Github:http://github.com/dzwillia/vu…


本文首发微信公众号:前端先锋

欢迎扫描二维码关注公众号,每天都给你推送新鲜的前端技术文章

欢迎扫描二维码关注公众号,每天都给你推送新鲜的前端技术文章

欢迎继续阅读本专栏其它高赞文章:


本文地址:H5W3 » 【前端技术】推荐 8 个漂亮的 vue.js 进度条组件

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址