VUE使用NProgress
2020-05-06 本文已影响0人
KC莲
引入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;