想在 vue 项目中拥有 instagram 那种绚丽的彩虹进度条? 不如试试这个

vue-ins-progress-bar

a vue component of ins-style progress bar

一款 ins 风格的 vue 进度条组件

Demo

Live Demo

Install

npm i vue-ins-progress-bar
复制代码

Usage

main.js

import VueInsProgressBar from 'vue-ins-progress-bar'const options = {position: 'fixed',show: true,height: '3px'
}Vue.use(VueInsProgressBar, options)
复制代码

App.vue

<template><div id="app"><router-view/><vue-ins-progress-bar></vue-ins-progress-bar></div>
</template><script>
export default {name: 'App',mounted () {this.$insProgress.finish()},created () {this.$insProgress.start()this.$router.beforeEach((to, from, next) => {this.$insProgress.start()next()})this.$router.afterEach((to, from) => {this.$insProgress.finish()})}
}
</script>
复制代码

APIs

this.$insProgress.start() // start the loading
复制代码

this.$insProgress.finish() // finish the loading
复制代码

this.$insProgress.height(4) // resize the height of loading bar to 4px
复制代码

Source

Repository: vue-ins-progress-bar

Author: @meloalright

License

MIT

这才是我想要的彩虹进度条-[vue-ins-progress-bar]相关推荐

idea忽略某些文件，idea配 jdk、maven，改背景颜色，切换账号，彩虹进度条插件
idea相关配置 1. 忽略某些文件 2.配置jdk 3.maven配置 4.修改idea主题颜色 4.1 更多修改主题的方法 4.2 更多绚丽的主题推荐 4.3 自认为好看的几个主题 1. past ...
Java做彩虹进度条,Android自定义控件-彩虹条进度条
在Android手机中我们经常可以看到类似于彩虹条的进度条,尤其是在显示下载进度的时候,一般都会使用彩虹条的形式表示下载进度,下面就来讲解这种彩虹条是如何实现的: 1.首先我们先来看一下彩虹条的效果图 ...
这才是我想要的云盘工具
2019独角兽企业重金招聘Python工程师标准>>> 这才是我想要的云盘工具它安全的存储我的数据.物理安全.网络安全.政治安全.对提供服务的企业安全. 可以设定分享条件,将指定文 ...
米家电磁炉显示e10_米家电磁炉深度使用解析这才是我想要的
原标题:米家电磁炉深度使用解析这才是我想要的这才是我一直想要的那种电磁炉,这就是我用过"米家电磁炉"后的最大感受. 做为一个每天都在家做饭的人来说,一套好的装备是非常重要的,这 ...
想建一个带分隔条的label 控件；
想建一个带分隔条的label 控件: Delphi / Windows SDK/API http://www.delphi2007.net/DelphiBase/html/delphi_2006120 ...
android众筹进度条实现,想让众筹进度条一下子到底？看看这几步都做到了吗
原标题:想让众筹进度条一下子到底?看看这几步都做到了吗哈喽,大家好,我是筱筱! 荀子曾曰:锲而舍之,朽木不折:锲而不舍,金石可镂.放弃坚持,即使朽木也难以折断:坚持不懈地刀刻,即使金属石头也能够雕出 ...
Android自定义控件-彩虹条进度条
在Android手机中我们经常可以看到类似于彩虹条的进度条,尤其是在显示下载进度的时候,一般都会使用彩虹条的形式表示下载进度,下面就来讲解这种彩虹条是如何实现的: 1.首先我们先来看一下彩虹条的效果图 ...
985程序员吐槽：互联网行业疲于奔命，公务员才是我想要的生活
对于很多应届生而言,选择在企业工作还是做公务员,是两种截然不同的人生道路.就像下面这名985应届生所吐槽的一样,选择互联网行业虽然钱多,但年纪一大就疲于奔命,而公务员虽然工资不高,但却可以做到工作和生 ...
木桶排序算法_这才是你想要桶排序
前面说的昨天发的桶排序文章,有同学回复,确实有比较精明的同学,文章就是想提出一个比较简单的思路,本来想给自己的排序方式写个名字叫做"木桶排序",这篇文章讲解真正的桶排序,结合前面 ...
多普达同步软件4.5_这才是我想要的笔记软件，为知笔记深度体验报告
昨天的文章分享了如何选择一款合适的笔记软件以及笔者对为知笔记的初步使用体验.今天来带大家深度体验一下为知笔记软件的各种功能. 我认为笔记软件有助于学习.办公和写作.本期是笔记软件分享文章的最后一篇,主 ...

这才是我想要的彩虹进度条-[vue-ins-progress-bar]

vue-ins-progress-bar

Demo

Install

Usage

APIs

Source

License

这才是我想要的彩虹进度条-[vue-ins-progress-bar]相关推荐

最新文章

热门文章