路由守卫 登录

//main的js文件下面的页面
	import Vue from 'vue'
	import App from './App.vue'
	import router from './router'
	import store from './store'
	import axios from 'axios'
	import ElementUi from 'element-ui'
	import Router from "vue-router";

//关键的核心是这个路由守卫的 拦截

	router.beforeEach((to,from,next)=>{
	    console.log(to);
	    console.log(from);
	    if(to.name==="login"){
	        next()
	    }else{
	        //需要验证是否登录成功
	        if(sessionStorage.getItem("userLogin")){
	          next()
	        }else{
	          next({
	              path:"/login"
	          })
	        }
	    }
	})
	Vue.config.productionTip = false
	Vue.prototype.$axios= axios
	Vue.use(ElementUi)
	new Vue({
	  router,
	  store,
	  render: h => h(App)
	}).$mount('#app')


//login 登录页面






.//路由拦截页面
import Vue from 'vue'
import Router from 'vue-router'
import home from "./views/home"
import login from "./views/login"
Vue.use(Router)
export default new Router({
  routes: [
      {
          path:"/",
          name:"login",
          component:login
      },
      {
          path:"/home",
          name:"home",
          component:()=>import("./views/home.vue")
      }

  ]
})

你可能感兴趣的:(笔记)