用Vuex+ Vue-router 实现页面的登陆拦截

首先我的想法是,别人拿到网站的url地址后。没用登陆直接进入index页面,在这理进行操作把他拦截下来,并返回一个login页面给他。
其次,下载Vuex 和 Vue -router,
注册号Vue -router后先写几个路由地址 如图:
在这里插入图片描述
如果那些url需要进行拦截则就在该url内加上 meta: {requireAuth: true} 字段在这里插入图片描述
在Vuex文件夹中store.js中加上进行管理的状态值
在这里插入图片描述
在main.js具体实现代码在这里插入图片描述
(注意!需要在main.js中引入 router的index文件和 Vuex的 store文件)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
(注意!router.beforeEach需要写在Vue实例前面)
在这里插入图片描述
注意中间的小坑!!!

猜你喜欢

转载自blog.csdn.net/a519637560/article/details/84989189