简要介绍

NProgress.js是一款JavaScript展示进度条效果的组件。名字中的大写字母N，全称是nanoscopic，意思是纳米级。实际的效果就是超细的进度条。这是一个很有特色的爆款组件，虽然有五六年没有进行更新了，但依然无法阻挡它在github拥有22k颗星。这个组件最合适、最匹配的场景就是Ajax。

最新版本：v0.2.0。我对它的评价是：有年份的单品类爆款。

Github地址

https://github.com/rstacruz/nprogress

安装

$ npm install --save nprogress

引用

<script src='nprogress.js'></script>

<link rel='stylesheet' href='nprogress.css'/>

效果

NProgress.start();

NProgress.done();

百分比用法：

NProgress.set(0.0); // Sorta same as .start()

NProgress.set(0.4);

NProgress.set(1.0); // Sorta same as .done()

增量用法：

NProgress.inc();

NProgress.inc(0.2); // This will get the current status value and adds 0.2 until status is 0.994