解决vue请求接口第一次成功,第二次失败问题


Posted in Javascript onSeptember 08, 2020

使用vue去请求接口发现问题来了:

我请求只能请求一次,然后在按按钮去请求的时候发现

502(这个是接口定义的)502就是传了空的值过来 这个是其中一种情况,还有别的情况 你看了 大可试试我这样的办法

然后发现我前端代码没有问题,接口代码也没有问题

data() {
  return {
    form: {
      old_password: '',
      new_password: '',
      confirm_password: ''
    }
  }
},

就是把值在重新赋值回去就可以解决了

this.$http.post('/api/users/modifyPassword', this.form,
  (res) => {
    this.form = {
      old_password: this.form.old_password,
      new_password: this.form.new_password,
      confirm_password: this.form.confirm_password
    }
    if (is.object(res)) {
      console.log(res)
      if (res.code === '0') {
        this.$router.push({ path: '/my/' })
        this.$toast.show(res.msg)
      } else {
        this.$toast.show(res.msg)
      }
    }
  })

补充知识:vue中使用axios请求接口,请求会发送两次

vue中使用axios请求接口,请求会发送两次的问题

浏览器分为简单请求以及非简单请求:

解决方案:

跨域请求需要先发一次Option预请求,OPTIONS是检验是否允许跨域的,如果不希望OPTIONS请求, 直接让后端遇到option直接返回就可以了,前端可不做处理。

以上这篇解决vue请求接口第一次成功,第二次失败问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js计算页面刷新的次数
Jul 20 Javascript
Js 弹出框口并返回值的两种常用方法
Dec 30 Javascript
非常棒的10款jQuery 幻灯片插件
Jun 14 Javascript
Jquery实现自定义窗口随意的拖拽
Mar 12 Javascript
Javascript中this关键字的一些小知识
Mar 15 Javascript
JavaScript jQuery 中定义数组与操作及jquery数组操作
Dec 18 Javascript
Javascript的表单与验证-非空验证
Mar 18 Javascript
浅谈struts1 & jquery form 文件异步上传
May 25 jQuery
javascript 中select框触发事件过程的分析
Aug 01 Javascript
JS实现li标签的删除
Apr 12 Javascript
Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定
Apr 29 Javascript
JavaScript实现栈结构详细过程
Dec 06 Javascript
如何区分vue中的v-show 与 v-if
Sep 08 #Javascript
谈谈JavaScript中的函数
Sep 08 #Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
Sep 08 #Javascript
浅析JavaScript 函数柯里化
Sep 08 #Javascript
Vue.js使用axios动态获取response里的data数据操作
Sep 08 #Javascript
JavaScript 事件代理需要注意的地方
Sep 08 #Javascript
Vue axios 跨域请求无法带上cookie的解决
Sep 08 #Javascript
You might like
PHP输出控制功能在简繁体转换中的应用
2006/10/09 PHP
隐性调用php程序的方法
2009/03/09 PHP
mysql下创建字段并设置主键的php代码
2010/05/16 PHP
通过php添加xml文档内容的方法
2015/01/23 PHP
php统计数组元素个数的方法
2015/07/02 PHP
PHP实现文件上传与下载
2020/08/28 PHP
TopList标签和JavaScript结合两例
2007/08/12 Javascript
查询绑定数据岛的表格中的文本并修改显示方式的js代码
2009/12/15 Javascript
jQuery使用技巧简单汇总
2013/04/18 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
2013/12/17 Javascript
JS获取网页属性包括宽、高等等
2014/04/03 Javascript
JavaScript对象之深度克隆介绍
2014/12/08 Javascript
js判断手机端(Android手机还是iPhone手机)
2015/07/22 Javascript
Highcharts使用简例及异步动态读取数据
2015/12/30 Javascript
Bootstrap实现带暂停功能的轮播组件(推荐)
2016/11/25 Javascript
js实现添加删除表格(两种方法)
2017/04/27 Javascript
在 Typescript 中使用可被复用的 Vue Mixin功能
2018/04/17 Javascript
微信小程序在线客服自动回复功能(基于node)
2019/07/03 Javascript
vue项目中js-cookie的使用存储token操作
2020/11/13 Javascript
vue 封装面包屑组件教程
2020/11/16 Javascript
[06:25]第二届DOTA2亚洲邀请赛主赛事第二天比赛集锦.mp4
2017/04/03 DOTA
python函数装饰器用法实例详解
2015/06/04 Python
使用Python制作微信跳一跳辅助
2018/01/31 Python
Python中请不要再用re.compile了
2019/06/30 Python
FFT快速傅里叶变换的python实现过程解析
2019/10/21 Python
终于搞懂了Keras中multiloss的对应关系介绍
2020/06/22 Python
美国从事品牌鞋类零售的连锁店:Famous Footwear
2016/08/25 全球购物
Ray-Ban雷朋瑞典官方网站:全球领先的太阳眼镜品牌
2019/08/22 全球购物
亿阳信通股份有限公司笔试题(C#)
2016/03/04 面试题
什么是ARP(Address Resolution Protocol)地址解析协议
2013/10/31 面试题
书法比赛获奖感言
2014/02/10 职场文书
关于运动会的广播稿
2014/09/22 职场文书
发布会邀请函
2015/01/31 职场文书
小学语文教学随笔
2015/08/14 职场文书
2019销售早会主持词
2019/06/27 职场文书
java executor包参数处理功能 
2022/02/15 Java/Android