Skip to content

Instantly share code, notes, and snippets.

@nikkanetiya
Created September 6, 2017 12:40
Show Gist options
  • Star 11 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save nikkanetiya/dada964a452f87c103ac2cd44ee667a4 to your computer and use it in GitHub Desktop.
Save nikkanetiya/dada964a452f87c103ac2cd44ee667a4 to your computer and use it in GitHub Desktop.
NProgress bar with axios
import 'nprogress/nprogress.css'
import NProgress from 'nprogress'
import axios from 'axios'
const calculatePercentage = (loaded, total) => (Math.floor(loaded * 1.0) / total)
const setupUpdateProgress = () => {
axios.defaults.onDownloadProgress = e => {
const percentage = calculatePercentage(e.loaded, e.total)
NProgress.set(percentage)
}
}
const setupStopProgress = () => {
axios.interceptors.response.use(response => {
NProgress.done(true)
return response
})
}
export function load(config) {
NProgress.configure(config)
setupUpdateProgress()
setupStopProgress()
}
@yakubenko
Copy link

Thanks for the script! I'll use a slightly modified version of it in my project!

@atorscho
Copy link

Thanks for the script. I edited it a bit too. You forgot to put NProgress.start() or do you call this function somewhere else?

@stepanushariara
Copy link

stepanushariara commented Aug 1, 2019

Hi, How to consume this code.? Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment