VUE使用NProgress

引入NProgress

npm install --save nprogress 

在路由中使用

import Vue from 'vue';
import VueRouter from 'vue-router';
Vue.use(VueRouter);
import NProgress from 'nprogress'; // progress bar
import 'nprogress/nprogress.css'; // progress bar style

const routes = [
    {
        path: '/',
        component: () => import('@/views/home')
    },
];

const createRouter = () =>
    new VueRouter({
        mode: 'history',
        scrollBehavior: () => ({ y: 0 }),
        routes,
    });

const router = createRouter();

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

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

export default router;

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容