韩国云服务器,vue全局路由守卫如何使用
创始人
2024-12-26 15:01:57
0

在vue中使用全局路由守卫的方法:1.新建项目,安装vue-router;2.引入vue和vue-router;3.使用Vue.use注册路由;4.定义和配置路由;5.执行代码使用全局路由守卫;

vue全局路由守卫如何使用

具体步骤如下:

1.首先,新建一个html项目,并在项目中安装vue-router;

npm install vue-router

2.vue-router安装好,在项目中引入vue和vue-router;

import Vue from \'vue\'

import Router from \'vue-router\'

3.vue和vue-router引入后,在项目中使用Vue.use方法注册一个路由;

Vue.use(VueRouter)

4.路由注册好后,在项目中定义路由并配置;

export default new vueRouter({

routes: [{

path: \'/\',

component: Index

}, {

path: \'/Detail\',

component: Detail,

meta: {

requireLogin: 2

}

}, {

path: \'/Center\',

component: Center,

meta: {

requireLogin: 1

}

}]

})

5.最后,路由配置好后,在项目中执行以下代码即可使用全局路由守卫;

import router from \'./router\'

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

let token = window.localStorage.getItem(\'token\')

if (to.meta.requireLogin && to.meta.requireLogin === 1) {

if (token) {

next()

} else {

next(\'/\')

}

} else if (to.meta.requireLogin && to.meta.requireLogin === 2) {

if (token) {

next(\'/center\')

} else {

next()

}

} else {

next()

}

})

相关内容

热门资讯

菲尔兹奖得主王虹4岁不慎烫伤,... 中国数学家王虹、邓煜获得菲尔兹奖,这是中国籍数学家首次获得这一奖项。王虹1991年出生在广西桂林平乐...
美媒:特朗普下令暂停空袭伊朗 美国“Axios”新闻网7月25日援引知情人士报道,特朗普24日指示美军不得对伊朗发动新的打击,打破...
法国野火“创历史纪录”:政坛吵... 综合法媒BFM新闻台、《费加罗报》报道,当地时间7月25日中午,内政部长努内兹(Laurent Nu...
51.79亿,携程真的疼了吗? 2026年7月25日,市场监管总局对携程反垄断案作出行政处罚:罚没款合计51.79亿元。但这个数字被...
一艘越南籍渔船在南沙遇险,29... 新华社三沙7月25日电(记者赵颖全)记者从三沙海上搜救中心获悉,25日傍晚,一艘越南籍渔船在南沙永暑...
成都如何耕好新型工业化“试验田... 7月24日,APEC数字周城市侧配套活动——制造强国建设专家研讨暨新型工业化推进交流会举行,院士专家...
活力中国调研行丨检测设备“长腿... 从排放控制的细分龙头到智能装备的新入局者,凯龙高科的转型路径,为观察传统制造业如何切入新赛道提供了一...
原创 别... 别被顶级奖项光环忽悠透了!拿菲尔兹奖的王虹,道出基础科研最现实的人间落差 开篇:大众脑补的名利双收,...
温州划龙桥惠耳——如何应对老年... 年近古稀的老人,近来时常出现耳鸣。周日,孩子们来了,跟她说话,声音小了她听不清,声音大了她嫌吵得慌,...
民调:包括共和党人在内,美国人... 据美国有线电视新闻网(CNN)当地时间24日报道,多项最新民调结果显示,包括许多共和党人在内,美国民...