React 頂部進(jìn)度條
瞎扯
在做Ajax 請(qǐng)求,或者請(qǐng)求相關(guān)資源的時(shí)候, 需要有一個(gè)進(jìn)度條來(lái)讓頁(yè)面看起來(lái)更加的自然,簡(jiǎn)潔美觀. 在 存JS 下,有很多 progress的實(shí)現(xiàn)方式, 這里提供一個(gè) react 下的實(shí)現(xiàn)方式.
React中 如何使用
- 引入 pace.js 和 pace.css
import Pace from './common/js/pace'
import './common/css/pace.less'
- 開(kāi)始顯示 progress 挑
Pace.start()
- 然后看效果即可. 就這么簡(jiǎn)單
當(dāng)然,效果有那么多種,如何改變效果呢?
github 源碼地址 這里面的 DOWNLOAD 里面其實(shí)是樣式,復(fù)制替換到 pace.css即可
效果圖:
Paste_Image.png