vue 使用NProgress

为了实现页面载入的时候,浏览器顶部有载入动画

1,安装

npm install --save nprogress

2,引入,例如要在切换路由,加载页面时实现进度条

router.beforeEach((to, from, next) => {
  NProgress.start()
  next()
})

router.afterEach(() => {
  NProgress.done()
})

3,在进行ajax请求时出现进度条

//interceptors拦截器
Vue.http.interceptors.push((request, next) => {  
  NProgress.start();

  next((response)=>{
    NProgress.done();
  });
});

猜你喜欢

转载自blog.csdn.net/qq_40954793/article/details/84957643