vue实现登陆登出的实现示例

//router.jsrouter.beforeEach((to, from, next) => { // 若userkey不存在并且前往页面不是登陆页面，进入登陆 // 若userkey存在并且前往登陆页面，进入主页 const userKey = localStorage.getItem('userKey') if (!userKey && to.path !== '/login') {  next({   path: '/login',   query: { redirect: to.fullPath }  }) } else if (userKey && to.path === '/login') {  next({ path: '/' }) } else {  next() }})

//若验证成功跳转 var redirect = decodeURIComponent(this.$route.query.redirect || '/')     self.$router.push({      // 你需要接受路由的参数再跳转      path: redirect     })

// respone拦截器axios.interceptors.response.use( response => {  console.log(response)  const data = response.data  if (data.status === 0) {   MessageBox.alert('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {    confirmButtonText: '确定',    type: 'warning'   }).then(() => {    localStorage.clear()    router.replace({     path: '/login'    })    return   }).catch(() => {    localStorage.clear()    router.replace({     path: '/login'    })   })  } else {   return response  } }, error => {  if (error && error.response) {   switch (error.response.status) {    case 400:     error.message = '请求错误'     break    case 401:     error.message = '未授权，请登录'     break    case 403:     error.message = '拒绝访问'     break    case 404:     error.message = (process.env.NODE_ENV === 'production' ? `请求地址出错` : `请求地址出错: ${error.response.config.url}`)     break    case 408:     error.message = '请求超时'     break    case 500:     error.message = '服务器内部错误'     break    case 501:     error.message = '服务未实现'     break    case 502:     error.message = '网关错误'     break    case 503:     error.message = '服务不可用'     break    case 504:     error.message = '网关超时'     break    case 505:     error.message = 'HTTP版本不受支持'     break    default:   }   Message({    message: error.message,    type: 'error',    duration: 5 * 1000   })  }  return Promise.reject(error) })

 loginOut() {   var self = this   this.$confirm('您确定要退出吗?', '退出管理平台', {    confirmButtonText: '确定',    cancelButtonText: '取消'   }).then(() => {    const info = {     'userkey': localStorage.getItem('userKey')    }    self.$store.dispatch('LogOut', info).then(() => {     self.$router.push({ path: '/login' })    }).catch(() => {    })   }).catch(() => {   })  }