vue使用路由判断是否登录

最新推荐文章于 2022-04-18 22:23:28 发布
最新推荐文章于 2022-04-18 22:23:28 发布
阅读量183 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/wangyunhui/p/7372103.html
版权

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

  // console.log('to:' + to.path)

  if (to.path.startsWith('/login')) {

    window.sessionStorage.removeItem('access-user')

    next()

  } else {

    let user = JSON.parse(window.sessionStorage.getItem('access-user'))

    if (!user) {

      next({path: '/login'})

    } else {

      next()

    }

  }

})

转载于:https://www.cnblogs.com/wangyunhui/p/7372103.html

weixin_30437847
关注
vue路由（十一）vue路由： 判断是否登录，未登录跳转到登录页
jieweiwujie的博客
09-14 2386
Vue 判断是否登录，未登录跳转到登录页
vue路由跳转时 判断用户是否处于 登录状态
腾讯全栈-ITCJF
02-15 1890
vue路由跳转时 判断用户是否处于 登录状态
vue项目中添加登录拦截器
李苗苗的博客
10-08 6117
 一个简单的登录拦截器，如果当前页面是登录页面则不做处理，如果不是登录页面，看能否获得JESSIONID，如果有不做处理，如果不存在的话则跳转的登录页面。 router.beforeEach((to, from, next) => {   if (to.path.startsWith('/login')) {     next()   } else {     let user ...
startsWith()方法
热门推荐
玲曦的博客
04-15 4万+
startsWith()方法用来判断当前字符串是否是以另外一个给定的子字符串“开头”的，根据判断结果返回 true 或 false。 参数: str.startsWith(searchString [, position]); searchString 要搜索的子字符串。 position 在 str 中搜索 searchString 的开始位置，默认值为 0，也就是真正的字符串开头处。 示例: ...
startswith和endswith（以xxx开头，以xxx结尾）
weixin_33963594的博客
06-27 606
startswith和endswith（以xxx开头，以xxx结尾）： 注：以.pac.gz结尾：if g.endswith('.pac.gz'): vi a1.py #!/usr/bin/python import os d = open('/log/110Hud/tjpacgms.txt','r')for e in d.readlines():d.close()for root,dirs,fi...
Python str.startswith(prefix[, start[, end]])
既然选择了远方 便只顾风雨兼程 - 永强
08-15 1262
Python str.startswith(prefix[, start[, end]])
vue 利用路由守卫判断是否登录的方法
10-17
在这个例子中，我们将详细解释如何利用Vue Router的路由守卫来判断用户是否已登录，并据此决定是否允许访问特定的页面。 首先，我们需要在项目中的`router/index.js`文件中导入必要的组件。在这里，我们导入Vue、...
vue路由跳转时判断用户是否登录功能的实现
08-29
"vue路由跳转时判断用户是否登录功能的实现" 这篇文章主要讲解了如何在 Vue 中实现路由跳转时判断用户是否登录的功能。下面我们将详细讲解该功能的实现步骤： Step 1: 使用 Vuex 管理用户登录状态 在实现用户登录...
使用vue-router beforEach实现判断用户登录跳转路由筛选功能
08-27
本篇文章将探讨如何利用Vue Router的`beforeEach`钩子函数实现用户登录状态判断，确保用户在访问特定路由时已登录，否则重定向到登录页面。 首先，`beforeEach`是Vue Router提供的全局前置守卫，它会在每次路由切换...
vue 设置路由的登录权限的方法
08-27
// 判断该路由是否需要登录权限 if (sessionStorage.getItem("access_token")) { // 如果用户已经登录，直接跳转到目标路由 next() } else { // 如果用户未登录，重定向到登录页面 next({ path: '/login', ...
python中startswith()函数的用法
九天小牛
10-13 3万+
python字符串函数用法大全链接 startswith()函数 描述：判断字符串是否以指定字符或子字符串开头。 语法：str.endswith("suffix", start, end) 或 str[start,end].endswith("suffix")    用于判断字符串中某段字符串是否以指定字符或子字符串结尾。 —> bool    返回值为布尔类型（True,Fals...
javax.imageio.IIOException: Not a JPEG file: starts with 0x89 0x50
likeflower950的博客
06-12 6464
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦： Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和图片上传 LaTex数学公式 UML序列图和流程图 离线写博客 导入导出Markdown文件 丰富的快捷键 快捷键 加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
ES6-字符串扩展-includes(), startsWith(), endsWith()
极北
10-26 3914
ES5只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6又提供了三种新方法。 includes()：返回布尔值，表示是否找到了参数字符串； startsWith()：返回布尔值，表示参数字符串是否在查找字符串的头部； endsWith()：返回布尔值，表示参数字符串是否在查找字符串的尾部。   let s = 'Hello world!'; s.star...
vue.js+elementUI学习01之后台管理登录验证实现axios和springMVC交互
夢の殇
08-23 1万+
前段时间学习了vue.js的一些相关知识。现在动手敲代码，想实现一个简单的后台管理，包括登录验证、菜单导航、列表、增删改查，菜单/按钮的权限控制等一些常见功能。当然网上也有很多例子了，只是想自己敲一遍代码。一直从事后台开发，公司都是有专门的前端设计及开发的，所以本人的js/css基础非常差，只能随意弄弄了。      网上找了下，这篇博文给的例子非常不错http://www.cnblogs.co
Vue-router 不允许导航到当前位置（"/path"）错误原因以及修复方式
rudy_zhou的博客
02-24 7900
Vue-router 不允许导航到当前位置（/path）报错提示错误原因错误演示解决方法方法一方法二方法三 报错提示 Navigating to current location ("/path") is not allowed 错误原因 控制台出现以上这种 Navigating to current location ("/path") is not allowed 时，是因为重复进入了相同路...
权限管理模块中动态加载Vue组件
江南一点雨的专栏
01-17 9733
当前后端分离时，权限问题的处理也和我们传统的处理方式有一点差异。笔者前几天刚好在负责一个项目的权限管理模块，现在权限管理模块已经做完了，我想通过5-6篇文章，来介绍一下项目中遇到的问题以及我的解决方案，希望这个系列能够给小伙伴一些帮助。本系列文章并不是手把手的教程，主要介绍了核心思路并讲解了核心代码，完整的代码小伙伴们可以在GitHub上star并clone下来研究。另外，原本计划把项目跑起来放到网
ES6新增方法：startsWith()方法和endsWith()方法来判断字符串以什么开头或者什么结尾
前端挖掘机
03-31 5705
ES6新增方法：startsWith()方法和endsWith()方法来判断字符串以什么开头或者什么结尾 startsWith()方法 该startsWith()方法确定字符串是否以指定字符串的字符开头，返回true或false视情况而定。 判断字符串以什么开头一般的话是用于来判断是否以http://开头或者以file:///开头 参数 接受两个参数 第一个参数，要在此字符串开头搜索的字符， 第...
ES6新语法之字符串新增方法：startswith() ，endswith()，trim() 方法
weixin_45819386的博客
04-18 3641
系列文章目录 文章目录系列文章目录前言1.startwith（）方法2.endwith（）方法3.trim（）方法输出结果为： ![在这里插入图片描述](https://img-blog.csdnimg.cn/7c747955729a4ffab4aa4038b433f8c4.png)总结 前言 随着ES6的到来，我们JavaScript语法新增了许多语法，今天就来分享一篇关于字符串新增方法的知识； 1.startwith（）方法 作用：startsWith() 方法用于检测字符串是否以指定的前缀开始。
vue使用路由守卫判断登录的例子
最新发布
05-25
在 Vue 中使用路由守卫可以很方便地判断用户是否已经登录，如果未登录则跳转到登录页面。以下是一个简单的例子： ```javascript import Vue from 'vue' import Router from 'vue-router' import Login from '@/views/Login.vue' import Dashboard from '@/views/Dashboard.vue' Vue.use(Router) const router = new Router({ routes: [ { path: '/', name: 'Dashboard', component: Dashboard, meta: { requiresAuth: true // 添加 meta 属性，表示需要登录才能访问该页面 } }, { path: '/login', name: 'Login', component: Login } ] }) router.beforeEach((to, from, next) => { if (to.meta.requiresAuth && !isAuthenticated()) { // 判断该页面是否需要登录，以及用户是否已经登录 next('/login') // 如果未登录则跳转到登录页面 } else { next() // 否则放行 } }) function isAuthenticated () { // 判断用户是否已经登录，可以根据实际情况自行实现 return localStorage.getItem('username') !== null } export default router ``` 在上面的例子中，我们定义了两个路由，一个是 `/`，表示用户登录后进入的主页，另一个是 `/login`，表示登录页面。在定义 `/` 路由时，我们通过添加 `meta` 属性来表示该页面需要登录才能访问。在路由守卫中，我们通过调用 `isAuthenticated` 函数来判断用户是否已经登录，如果未登录则跳转到登录页面，否则放行。 需要注意的是，这里的 `isAuthenticated` 函数只是一个示例，需要根据实际情况自行实现。在实际开发中，我们可能需要从后台获取用户信息并保存到本地，然后通过判断本地是否有用户信息来判断用户是否已经登录。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值