背景介绍
下载了开源的antd vue pro源码用于后台管理系统的开发,但是原项目中是使用mockjs数据模拟后台管理用户登入系统的。在没有做七牛云上传文件之前,需求是不需要去掉mockjs模拟数据的。但是在接入七牛云上传之后,点击上传时总是报错Uncaught TypeError: this.xhr.upload.addEventListener is not a function
,在网上查找资料后,得到原因如下:
mockjs是一个模拟后台接口的JS库,它的原理是重写了XMLHttpRequest,它可以在接口没出来时非常方便的模拟数据,上线之后不引用它即可。一般上报插件中会使用原生XMLHttpRequest,而原生XMLHttpRequest已被mockjs覆盖找不到相应的方法,所以会出错。除了mockjs之外,zonejs、oboejs、fetchjs也有自己的的XMLHttpRequest库,请慎用
解决办法:
直接弃用了mockjs
解决过程
main.js文件
package.json文件删除mockjs依赖
user.js文件
根据后台返回的用户信息json数据来取值
permission.js文件
login.js文件
router.config.js修改菜单权限