Vue框架学习系列-VueRouter

vue-router

路由模式有两种：

• 1：hash：路径带#符号，如 http://localhost/#/login
• 2：history： 路径不带#符号，如 http://localhost/login

修改路由配置代码如下：

export default new Router({

​	mode: 'history',

​	routes: [

​	]

});

路由钩子

路由导航守卫

beforeEach：

// 挂载路由导航守卫

router.beforeEach((to, from, next) => {

 // to:将要访问的路径

 // from:从哪一个路径跳转而来

 // next:表示放行

 // 1.next() 表示放行 2. next('login')强制跳转

 if (to.path === '/login') return next();

 // 获取token

 const tokenStr = window.sessionStorage.getItem('token');

 `if (!tokenStr) return next('/login');

 `next();`

})