介绍 import Vue 得到& # 39;vue # 39;
import Router 得到& # 39;vue-router& # 39;
import {登录},得到& # 39;. ./共同/js/islogin& # 39;
import HelloWorld 得到& # 39;@/组件/helloworld # 39;
import Login 得到& # 39;@/页面/登录# 39;
import Index 得到& # 39;@/页面/索引/指数# 39;Vue.use(路由器); const router =, new 路由器({
,路线:[
,{
,,路径:& # 39;/& # 39;
,,重定向:& # 39;/登录# 39;
},
,{
,,路径:& # 39;/登录# 39;
组件:才能登录
},
,{
,,路径:& # 39;/指数# 39;
元才能:{
requireAuth才能:真的,,//,添加该字段,表示进入这个路由是需要登录的
,,},
组件:才能指数
,}
,)
}); router.beforeEach((下),,,,,=祝辞,{
,if (to.meta.requireAuth),{,,//如果需要跳转,,往下走(1)
,if (真实),{,,//判断是否登录过,如果有登陆过,说明有令牌,或者令牌未过期,可以跳过登录(2)
if 才能;(to.path ===, & # 39;/登录# 39;),{,//判断下一个路由是否为要验证的路由(3)
下才能(& # 39;/指数# 39;);,,,//,如果是直接跳到首页,
,,},else {,,,//如果该路由不需要验证,那么直接往后走
下才能();
,,}
,}else {
console.log才能(& # 39;没有& # 39;);,,//如果没有登陆过,或者token 过期,,那么跳转到登录页
下才能(& # 39;/登录# 39;);
,}
,}else {,,,,,,//不需要跳转,直接往下走
接下来,();
,}
});export default 路由器; vue是什么
怎么在vue中利用路由守卫判断是否登录?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。
<强> 1。在路由器下的指数。js路由文件下,引入相关需要文件;
<强> 2。配置相关路由
<强> 3。路由配置完后,根据需要登录的页面判断路由跳转
vue是一套用于构建用户界面的渐进式JavaScript框架,vue与其它大型框架的区别是,使用vue可以自底向上逐层应用,其核心库只关注视图层,方便与第三方库和项目整合,且使用vue可以采用单文件组件和vue生态系统支持的库开发复杂的单页应用。
看完上述内容,你们掌握怎么在vue中利用路由守卫判断是否登录的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注行业资讯频道,感谢各位的阅读!
