vue项目使用element-ui组件上传文件报错upload.addEventListener is not a function Mock数据报错的解决方案

最新推荐文章于 2024-04-07 17:16:28 发布
最新推荐文章于 2024-04-07 17:16:28 发布
阅读量1.6k 收藏 1
点赞数 4
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_53979100/article/details/129951432
版权

分享下使用element-ui组件上传文件时报错upload.addEventListener is not a function Mock的解决方案：

首先出现这个错误的原因：
主要是因为mockjs改动了axios里面XMLHttpRequest对象从而导致报错

需要查找文件node_modules/mockjs/dist/mock.js以及node_modules/mockjs/src/mock/xhr/xhr.js

找到后打开文件大约在8312行和216行的位置添加以下代码

MockXMLHttpRequest.prototype.upload = xhr.upload

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

就是给MockXMLHttpRequest对象添加一个原生xhr.upload方法

朝露暮霭
关注
  • 4
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
详解Vue.js搭建路由报错 router.map is not a function
10-19
主要介绍了详解Vue.js搭建路由报错 router.map is not a function，非常具有实用价值，需要的朋友可以参考下
vue-cli3.0+element-ui上传组件el-upload的使用
10-17
主要介绍了vue-cli3.0+element-ui上传组件el-upload的使用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
upload.addEventListener is not a function报错
q1463944989的博客
07-12 1330
upload.addEventListener is not a function解决办法
Vue + Element-ui组件上传图片报错问题解决方案
TianXuab的博客
07-28 1589
总结起来，MockXMLHttpRequest对象的upload属性是一个非常有用的功能，它可以帮助我们模拟上传文件的过程，并对上传的进度进行监控。通过将xhr.upload属性赋值给MockXMLHttpRequest对象的upload属性，我们可以在模拟网络请求时使用upload属性来监控上传的进度。假设我们正在开发一个上传图片的功能，我们可以使用MockXMLHttpRequest对象来模拟上传图片的过程，并对上传的进度进行监控。在模拟上传的过程中，我们可以使用upload属性来监控上传的进度。
VUE上传功能本地上传正常，打包上传后报错TypeError: ***.upload.addEventListener is not a function
最新发布
aijisen的博客
04-07 310
尝试使用 Vue CLI 提供的打包分析工具，查看哪些文件被打包进了你的代码中，是否有可能因为某些文件没有被正确打包导致了问题。这个错误很可能是因为在打包后，文件的路径或者名称发生了变化，导致代码中的某些方法无法正确找到。检查你代码中使用的是 addEventListener 方法，而不是其他方法来绑定上传事件。确认你的上传代码是否与打包后的代码在同一目录下或同一级目录下，否则需要修改引用路径。确认你的上传代码路径是否正确，是否有被正确引入。
Vue中使用七牛云上传报错o.upload.addEventListener is not a function以及其他报错问题
weixin_40442888的博客
08-12 4345
1.运行提示o.upload.addEventListener is not a function 解决方案:(此方法不是根本解决办法，问题3的解决办法是最终解决方案) 找到node_modules/mockjs/dist/mock.js 第8308行 找到node_modules/mockjs/src/xhr/xhr.js 第216行(确保在生产模式下打包出来的代码正常使用。) 添加代码： Mo...
vue项目使用elementui上传组件 打包后报错t.upload.addEventListener is not a function的解决方案
qq_44146522的博客
04-17 1937
这个问题是因为mockjs改动了axios里面XMLHttpRequest对象致使的根据axios源码 l是一个XMLHttpRequest对象mockJs把l变量从XMLHttpRequest对象改为了MockXMLHttpRequest对象因此l.upload是一个空对象 空对象没有 addEventListener方法 因此报错。
在使用vue-admin-template中使用wangeditor上传文件时会报错o.upload.addEventListener is not a function
weixin_58661581的博客
03-24 340
2-2、在vue.config.js将before: require('./mock/mock-server.js')注释掉。2-1、npm uninstall mockjs 删除该模块依赖。在本地测试时可以上传，打包到服务器就报错，原因就在打包错的问题。==> 菜单配置 | wangEditor。开源 Web 富文本编辑器，开箱即用，配置简单。与 获取文件progress冲突。1、自定义上传图片的方法，参考官网。2-3、在src/main.js将。不熟悉的情况下推荐第二种方法。2、删掉mockjs相关。
Vue上传功能:****.upload.addEventListener is not a function
G佳伟
10-21 3754
VUE上传功能本地上传正常，打包上传nginx后报错TypeError: ***.upload.addEventListener is not a function。
vue axios 上传文件 xhr.addEventListener is not a function(…) 问题修复 不用卸载 mockjs
weixin_42489414的博客
09-17 494
vue 上传文件无法显示实时进度bug解决(vue + mockjs + axios)
vue3项目使用elementui-plus上传组件 打包后报错t.upload.addEventListener is not a function
weixin_49562833的博客
02-20 1158
vue3项目使用elementui-plus上传组件 打包后报错t.upload.addEventListener is not a function
addEventListener is not a function , JavaScript添加监听事件时报错
weixin_65793170的博客
03-21 4872
在写js代码的时候，控制台有时候会遇到这样的报错，addEventListener is not a function，说addEventListener不是一个函数，具体原因是因为侦听事件的事件源不对，事件源应该是一个元素，而非其它
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
10-18
今天小编就为大家分享一篇vue2.0 使用element-ui里的upload组件实现图片预览效果方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
主要介绍了Vue 报错TypeError: this.$set is not a function 的解决方法，分享给大家，需要的朋友们下面随着小编来一起学习学习吧
vue打包报错elementui上传组件 打包后报错t.upload.addEventListener is not a function
ddf__的博客
12-30 244
在node_modules/mockjs/dist/mock.js文件的大约8312行添加。同时修改node_modules/mockjs/src/xhr/xhr.js 第216行。打包上传出现了这个错误。
vue项目使用element-ui组件上传文件报错 上传报错upload.addEventListener is not a function Mock数据报错
懮俍的博客
09-07 1019
【代码】vue项目使用element-ui组件上传文件报错 上传报错upload.addEventListener is not a function Mock数据报错。
Axios + mockjs: request.upload.addEventListener is not a function 的原因和解决办法
O_o
03-08 4848
导致这一问题的根本原因是 Mockjs 中, 封装了原生的 XMLHttpRequest 为 MockXMLHttpRequest. 解决思路是, 把原生 XMLHttpRequest 的 upload 属性赋给 MockXMLHttpRequest 的原型对象.在 node_modules/mockjs/dist/mock.js 加入以下代码: 这样在开发环境是没问题了. 对于生产环境的处理 ...
通过npm引入的echart目录_用npm的方式引入echarts,出现这个错: el.addEventListener is not a funct...
weixin_39668527的博客
12-19 673
安卓IOS微信应该都是没问题的，如果是H5的话，不建议用封装的mpvue-echarts标签，而是使用原本的H5用法，采用预编译，类似import * as echarts from 'echarts'// #ifndef H5import mpvueEcharts from 'mpvue-echarts'// #endif...// #ifdef H5mounted(){this.myChart...
vue 使用 postcss-px2rem 报错node.getiterator is not a function
09-09
vue使用postcss-px2rem报错"node.getiterator is not a function"是因为postcss版本的问题。 postcss-px2rem是一个postcss插件，用于将px单位转换为rem单位。然而，早期版本的postcss的AST（抽象语法树）在解析时使用了方法"node.getiterator"，而新版的postcss已经将API进行了改变，没有"node.getiterator"这个方法。 要解决这个问题，可以尝试以下方法： 1. 升级postcss和postcss-px2rem插件。确保使用的版本兼容，并且postcss版本较高。 2. 检查package.json文件中的依赖项，查看是否有其他使用了postcss的插件，有时候不同版本的插件之间可能出现冲突。可以尝试将相关的插件版本进行调整或删除。 3. 查看webpack或者其他构建工具的配置文件，检查是否正确配置了postcss-loader和postcss-px2rem插件。可能需要调整或添加一些配置项来支持新版的postcss。 总之，以上是解决"node.getiterator is not a function"报错的一些方法，根据具体情况选择合适的解决方案。希望能够帮助到你。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值