vue的路由攔截器
阿新 • • 發佈:2018-11-19
1.index.js檔案
PS:route,是一條路由;routes 是一組路由;router 是一個機制,相當於一個管理者,它來管理路由
import Vue from 'vue';
import Router from 'vue-router';
// 要告訴 vue 使用 Router
Vue.use(Router)
// route是一個物件,多個route組成一個routes const routes = [ { path: '/', component: login, name: 'login' }, { path: '/action', component: action, name: 'action', children: [ {path: '/', component: index, name: 'index'}, {path: 'index', component: index, name: 'index'}, {path: 'index_add', component: index_add, name: 'index_add'}, {path: 'index_alter/:id', component: index_alter, name: 'index_alter'}, {path: 'product', component: product, name: 'product'}, {path: 'product_add', component: product_add, name: 'product_add'}, {path: 'product_alter/:id', component: product_alter, name: 'product_alter'}, {path: 'news', component: news, name: 'news'}, {path: 'news_add', component: news_add, name: 'news_add'}, {path: 'news_alter/:id', component: news_alter, name: 'news_alter'}, {path: 'aboutUs', component: aboutUs, name: 'aboutUs'}, {path: 'aboutUs_alter', component: aboutUs_alter, name: 'aboutUs_alter'} ] } ]
// 建立router對路由進行管理,由建構函式 new Router()建立,接收routes引數
const router = new Router({
routes: routes // 簡寫:routes
});
2. 路由攔截器
PS:判斷是否有token值或是否to登入頁,是則next(),否則跳轉到登入頁
export default router