路由导航守卫控制页面访问权限

只有登陆成功才能访问home（sessionStorage中有token才算登陆）

• 但是如果我们清除这个token，再次访问home呢，发现依然是可以访问页面
• 这就出问题了，那么我们就需要进行页面访问权限的控制了

如果用户没有登陆，但是直接通过URL访问特定页面，需要重新导航到登录页面。

import Vue from 'vue'
import Router from 'vue-router'
import Login from './components/Login.vue'
import Home from './components/Home.vue'

Vue.use(Router)

const router = new Router({
  routes: [
    { path: '/', redirect: '/login' },
    { path: '/login', component: Login },
    { path: '/home', component: Home }
  ]
})

// 挂载路由导航守卫
router.beforeEach((to, from, next) => {
  // to 将要访问的路径
  // from 代表从哪个路径跳转而来
  // next 是一个函数，表示放行
  //     next()  放行    next('/login')  强制跳转

  if (to.path === '/login') return next()
  // 获取token
  const tokenStr = window.sessionStorage.getItem('token')
  if (!tokenStr) return next('/login')
  next()
})

export default router