vue-element-admin框架修改为自己使用

简单记录一下这个框架的使用,把接口修改为自己的项目的过程
1、项目初始化(精简项目)首先吧views下除了在这里插入图片描述
以外的页面全部删除(后续看情况自己手动添加)
在这里插入图片描述
2、删除路由
把constantRoutes 下的路由删除到只剩下在这里插入图片描述
再把asyncRoutes下删除到只剩下
在这里插入图片描述
在这里插入图片描述
其实error也可以删除
3、删除src/router/modules文件夹
4、删除src/vendor文件夹
5、删除接口无关信息
删除mian.js里在这里插入图片描述
在这里插入图片描述
然后在在这里插入图片描述
6、修改你的域名
这是开发模式在这里插入图片描述

这是打包模式
在这里插入图片描述
7、修改请求接口
一般只需要在拦截这里做一下修改,把code改成你实际后段返回给你的接口数据就可以了省的后续在其他地方都这么操作在这里插入图片描述
8、这是关键我们梳理一下登录流程这个只有这一步好了才可以真正登录到网页
(1)在这里插入图片描述
调用了handleLogin随后方法走到store里的user.js
在这里插入图片描述
传递了用户名和密码后段返回给你token,框架会把你token存起来 !!注意这里还涉及到了一个方法在这里插入图片描述
后段在这里接口必须返回给你一个身份数组的格式[‘admin’],不然只有自己写死了,因为如果你不写这个会在全局路由守卫那里获取不到,ps(不过我是在找不到哪里调用了这个方法,这个那会困扰了我一天。死活登不上去 ,哭泣,知道的大佬说一下)
在这里插入图片描述
只有拿到这个hasRoles以后才会给你允许登录系统不然全居守卫不会让你用的啦~写到这里有后续再继续补充!嘻嘻!

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值