解决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 相关文章推荐
firefox下frameset取不到值的解决方法
Sep 06 Javascript
js正则表达exec与match的区别说明
Jan 29 Javascript
JavaScript导航脚本判断当前导航
Jul 12 Javascript
JavaScript省市级联下拉菜单实例
Feb 14 Javascript
利用JavaScript如何查询某个值是否数组内
Jul 30 Javascript
JavaScript-定时器0~9抽奖系统详解(代码)
Aug 16 Javascript
bootstrap Table服务端处理分页(后台是.net)
Oct 19 Javascript
angularjs实现时间轴效果的示例代码
Nov 29 Javascript
Angular2之二级路由详解
Aug 31 Javascript
vue插件实现v-model功能
Sep 10 Javascript
微信小程序实现弹出菜单动画
Jun 21 Javascript
使用layui的layer组件做弹出层的例子
Sep 27 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的开发框架的现状和展望
2007/03/16 PHP
Zend Framework教程之资源(Resources)用法实例详解
2016/03/14 PHP
Win7环境下Apache连接MySQL提示连接已重置的解决办法
2017/05/09 PHP
利用PHP实现开心消消乐的算法示例
2017/10/12 PHP
node.js中的console用法总结
2014/12/15 Javascript
node.js中的fs.fchmod方法使用说明
2014/12/16 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
2015/09/02 Javascript
JavaScript Array对象详解
2016/03/01 Javascript
Node.js程序中的本地文件操作用法小结
2016/03/06 Javascript
js多个物体运动功能实例分析
2016/12/20 Javascript
小程序开发实战:实现九宫格界面的导航的代码实现
2017/01/19 Javascript
基于javascript实现最简单选项卡切换
2017/02/01 Javascript
Underscore之Array_动力节点Java学院整理
2017/07/10 Javascript
Vue中的数据监听和数据交互案例解析
2017/07/12 Javascript
vue不通过路由直接获取url中参数的方法示例
2017/08/24 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
JavaScript深拷贝和浅拷贝概念与用法实例分析
2018/06/07 Javascript
react native 获取地理位置的方法示例
2018/08/28 Javascript
vant picker+popup 自定义三级联动案例
2020/11/04 Javascript
python使用新浪微博api上传图片到微博示例
2014/01/10 Python
Python内置模块logging用法实例分析
2018/02/12 Python
浅析python中numpy包中的argsort函数的使用
2018/08/30 Python
python读取图片任意范围区域
2019/01/23 Python
Python下opencv图像阈值处理的使用笔记
2019/08/04 Python
python对象销毁实例(垃圾回收)
2020/01/16 Python
Python图像处理库PIL的ImageEnhance模块使用介绍
2020/02/26 Python
python同时遍历两个list用法说明
2020/05/02 Python
python使用建议与技巧分享(二)
2020/08/17 Python
Vs Code中8个好用的python 扩展插件
2020/10/12 Python
Madda Fella官网:美国冒险家服装品牌
2020/01/16 全球购物
美国家用和厨房电器销售网站:Appliances Connection
2020/01/24 全球购物
会计出纳岗位职责
2013/12/25 职场文书
新书吧创业计划书
2014/01/31 职场文书
文明和谐家庭事迹材料
2014/05/18 职场文书
大班亲子运动会方案
2014/06/10 职场文书
Python 中的Sympy详细使用
2021/08/07 Python