vue formdata请求_vue修改数据没有渲染到页面的原因

vue formdata请求_vue修改数据没有渲染到页面的原因longlonglongtimenosee,最近遇到个奇葩的问题来记录下,不知道有没有小伙伴和我一样崩溃过。写了三年代码,上传这么简单的功能。第一次遇到前端入参fromData请求接口报500的问题,百度了好多资料尝试也没有解决。后台一直说我前端的问题,于是debugger一步一步查。下面来看看报错代码的流程,用你们的丰富经验和火眼金睛帮忙看下到底错在哪里了?!本项目用的是vue-cli…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

long long long time no see,最近遇到个奇葩的问题来记录下,不知道有没有小伙伴和我一样崩溃过。写了三年代码,上传这么简单的功能。第一次遇到前端入参fromData请求接口报500的问题,百度了好多资料尝试也没有解决。后台一直说我前端的问题,于是debugger一步一步查。下面来看看报错代码的流程,用你们的丰富经验和火眼金睛帮忙看下到底错在哪里了?!本项目用的是vue-cli3脚手架搭建,vue-admin-template后台框架开发。

1.首先封装axios请求,如下图所示:

vue formdata请求_vue修改数据没有渲染到页面的原因

vue formdata请求_vue修改数据没有渲染到页面的原因

2.vue文件点击上传按钮,获取的file文件赋值给this.file…如下所示:

vue formdata请求_vue修改数据没有渲染到页面的原因

红框内容是formData的值,console.log(formData.get(“file”))

vue formdata请求_vue修改数据没有渲染到页面的原因

debugger后的axios请求如下:

vue formdata请求_vue修改数据没有渲染到页面的原因

此时的formData为空对象。

network请求接口没有formData入参,不知道具体是什么原因。。。

vue formdata请求_vue修改数据没有渲染到页面的原因

请求头以及请求参数和后台沟通了也是一致的。。所以这种情况一直报500无法接收到前端参数,你们知道什么问题吗??

next,换了一种请求方式,用的axios原生请求格式写了一版,终于看到久违的200 ==…

接下来贴出解决的方案:

vue formdata请求_vue修改数据没有渲染到页面的原因

vue formdata请求_vue修改数据没有渲染到页面的原因

方方的,这样就解决了上传接口的问题。如果帮助到你们也是很开心的,当然也希望路过的大神们看到我的问题,欢迎留言哈~

stay hungry,stay fooish!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/181402.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • sklearn安装教程_cmd安装软件命令

    sklearn安装教程_cmd安装软件命令sklearn库sklearn是scikit-learn的简称,是一个基于Python的第三方模块。sklearn库集成了一些常用的机器学习方法,在进行机器学习任务时,并不需要实现算法,只需要简单的调用sklearn库中提供的模块就能完成大多数的机器学习任务。sklearn库是在Numpy、Scipy和matplotlib的基础上开发而成的,因此在介绍sklearn的安装前,需要先安装这些依赖库。…

    2022年10月17日
  • eclipse安卓项目_eclipse开发android

    eclipse安卓项目_eclipse开发androideclipse之安卓开发环境搭建一、安装JAVAJDK:二、安装AndroidSDK:三、为eclipse安装ADT插件。五、检查eclipse中的安卓SDK路径六、创建eclipse中的安卓模拟器网上不知道哪个哥们教程里提供的JAVAJDK15的安装包有问题,安装AndroidSDK的时候一直找不到它,干脆自己重新整理一份安装资料出来。一、安装JAVAJDK:下载JDK15的官网下载地址点这里,只需要下载下图中这个exe文件。安装一直按照提示点击即可,主要是选择安装路径,没啥其它

  • Pytest(1)安装与入门[通俗易懂]

    Pytest(1)安装与入门[通俗易懂]pytest介绍pytest是python的一种单元测试框架,与python自带的unittest测试框架类似,但是比unittest框架使用起来更简洁,效率更高。根据pytest的官方网站介绍,它

  • 【Electronics】数字电路实验——交通灯设计

    【Electronics】数字电路实验——交通灯设计数字电路实验——交通灯设计1.内容摘要2.设计任务及要求3.方案比较方案一:方案二:4.单元电路的工作原理4.1单位时间模块4.2二分频信号产生4.3交通灯控制电路模块4.4倒计时数码管显示模块5.拓展部分:手动设置单位时间模块5.1手动设置二、三分频切换模块5.2手动设置数码管倒计时电路相应的切换6.注意事项7.元器件清单8.参考文献1.内容摘要  &nbsp…

  • webstorm激活码最新2021(JetBrains全家桶)

    (webstorm激活码最新2021)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.cn/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~7…

  • c语言注释快捷键_c语言多行注释快捷键

    c语言注释快捷键_c语言多行注释快捷键//注释多行快捷键Ctrl+kctrl+l//解注释多行快捷键Ctrl+kctrl+u

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号