React 顶部进度条

瞎扯

在做Ajax 请求,或者请求相关资源的时候, 需要有一个进度条来让页面看起来更加的自然,简洁美观. 在 存JS 下,有很多 progress的实现方式, 这里提供一个 react 下的实现方式.

github 源码地址

React中 如何使用

1. 引入 pace.js 和 pace.css

import Pace from  './common/js/pace'
import './common/css/pace.less'

2. 开始显示 progress 挑

Pace.start()

3. 然后看效果即可. 就这么简单

当然,效果有那么多种,如何改变效果呢?
github 源码地址 这里面的 DOWNLOAD 里面其实是样式,复制替换到 pace.css即可

效果图:

Paste_Image.png

原文地址: 页面顶部Progress加载进度条