## 設置路由攔截
### 集成`nprogress`
```shell
$ yarn add nprogress
```
### 新建文件`/src/permission.js`
```javascript
import router from './router'
import store from './store'
import storage from 'store'
import Nprogress from 'nprogress'
import 'nprogress/nprogress.css'
import {ACCESS_TOKEN} from './store/mutation-types'
Nprogress.configure({showSpinner: false})
// 登錄頁面路由路徑
const loginRouterPath = '/login'
// 白名單
const whiteList = [loginRouterPath]
// 默認路由路徑
const defaultRouterPath = '/'
router.beforeEach((to, from, next) => {
Nprogress.start()
// 如有token
if (storage.get(ACCESS_TOKEN)) {
// 已經登錄,重復訪問登錄頁面,跳轉到默認頁面
if (to.path === loginRouterPath) {
next({path: defaultRouterPath})
}else{
next()
}
}else{
if(whiteList.includes(to.path)){
// 在免登錄白名單中,可以直接進入
next()
}else{
next({path:loginRouterPath, query:{redirect:to.fullPath}})
}
}
})
router.afterEach(()=>{
Nprogress.done()
})
```
### 在`/src/main.js`中引入`permission`
```javascript
...
import './permission'
...
```