vue-router nprogress钩子拦截器权限验证

三种安装方式可以选自己喜欢的
npm install --save nprogress
cnpm install --save nprogress
yarn add nprogress
// nprogress.js

import router from './router'
import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css' // progress bar style
import store from './store'

NProgress.configure({showSpinner: false}); // NProgress Configuration

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

  // 验证用户是否有权限进入此页面 没有权限则跳转首页
  if (!store.auth) {
	  router.push('/home')
  }
 next();
  //...
});

router.afterEach(() => {
  // finish progress bar
  NProgress.done()
});

猜你喜欢

转载自blog.csdn.net/qq_18567801/article/details/107840885