今天遇到这样一个问题，前端会同时弹出成功和失败的两个提示框，由于不是本人操作，也没有怀疑是前端代码的问题，就索性根据后端的日志作为分析依据，开始个人以为是后端接口上班了两次结果，一个是成功，另外一个是失败；但是经过对后端日志详细分析后发现后端的运作流程一切正常，没有发现异常的流程，这下就犯难了，又开始怀疑是不是快速操作导致的，可能是网络延迟导致前一个的结果还没送达，而第二次的结果就送达了，若是这样解释的话，也是可以理解的。后来又听说这现象是必现的，那总不可能都是网络原因吧。于是只好检查前端代码了，由于这些代码是其他同事很早之前写的，也没有怀疑会有逻辑和语法错误，一边梳理一遍自测，正好遇到同时弹出成功和失败的两个提示框，按下F12，一看console内容，提示有个变量是未定义的，一看代码原来是语法错误，在axios的then中使用了this对象，用this引用属性，导致抛出异常，就这么一个低级错误，隐藏这么深，不起眼，浪费我耗时这么久才发现，通过变量替换就可以了，用self替换this即可。

小结:个人觉得在函数体的开头最好定义let self=this，在函数体的其它地方统一使用self访问属性和方法，避免低级错误的发生。

20191108闪

JS中axios使用注意点的更多相关文章

  1. vue.js中axios的封装

    基于前文所述,axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它有很多优秀的特性,例如拦截请求和响应.取消请求.转换json.客户端防御XSRF等. 如果还对a ...

  2. 【原创】Vue.js 中 axios 跨域访问错误

    1.假如访问的接口地址为 http://www.test.com/apis/index.php  (php api 接口) 2.而开发地址为http://127.0.0.1:8080,当axios发起 ...

  3. vue中Axios的封装和API接口的管理

    前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...

  4. Vue.js中前端知识点总结笔记

    1.框架和库的区别: 框架:framework 有着自己的语法特点.都有对应的各个模块库 library 专注于一点 框架的好处: 1.提到代码的质量,开发速度 2.提高代码的复用率 3.降低模块之间 ...

  5. vue中axios 配置请求拦截功能 及请求方式如何封装

    main.js 中: import axios from '................/axios' axios.js 中: //axios.js import Vue from 'vue' i ...

  6. vue中Axios请求豆瓣API数据并展示到Swipe中

    vue中Axios请求豆瓣API数据并展示到Swipe中 1.首先是安装Axios: 安装方法cnpm install axios --save 等待npm安装完毕: 2.在main.js中引入axi ...

  7. vue中axios的封装

    第一步还是先下载axios cnpm install axios -S 第二步建立一个htttp.js import axios from 'axios'; import { Message } fr ...

  8. 前台框架vue.js中怎样嵌入 Echarts 组件？

    目前常用的图标插件有 charts,  Echarts, highcharts.这次将介绍 Echarts 在 Vue 项目中的应用. 一.安装插件 使用 cnpm 安装 Echarts cnpm i ...

  9. 「Vue」vue cli3中axios的基本用法

    1.安装axiosnpm i axios -S2.main.js中设置import axios from 'axios'Vue.prototype.$axios = axiosPS:这里有个小坑,ax ...

随机推荐

  1. MySql基础补漏笔记

    在MySQL教程|菜鸟教程系统复习的时候有一些知识点还没掌握透的或者思维方式还没完全跟上的地方,写了一个笔记,讲道理此笔记对除我之外的任何读者不具有任何实用价值,只针对我在复习MySQL基础过程中的查 ...

  2. 新手必看：PyCharm安装教程，Python开发者的有力工具

    PyCharm是由JetBrains打造的一款Python IDE,VS2010的重构插件Resharper就是出自JetBrains之手. 同时支持Google App Engine,PyCharm ...

  3. clr via c# 程序集加载和反射(2)

    查看,clr via c# 程序集加载和反射(1) 8,发现类型的成员: 字段,构造器,方法,属性,事件,嵌套类型都可以作为类型成员.其包含在抽象类MemberInfo中,封装了所有类型都有的一组属性 ...

  4. Kotlin Tutorials系列文章

    Kotlin Tutorials系列文章 想写一个有实用价值的Kotlin笔记, 让一线开发一看就懂, 看完就能上手. 当然官方文档更有参考价值了. 这个系列相对于官方文档的大而全来说, 最主要优势是 ...

  5. Android中通过ImageSwitcher实现相册滑动查看照片功能(附代码下载)

    场景 效果 注: 博客: https://blog.csdn.net/badao_liumang_qizhi关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 将需要滚动查看的照 ...

  6. ARC 064 F-Rotated Palindromes

    题意 问有多少个长度为 \(N\) 且字符集大小为 \(K\) 的字符串可以通过回文串旋转 (把第一个字符移到最后)若干次得到.\(N,K\le 10^9\) 做法 设\(f_i\)为最小周期为\(i ...

  7. ArcGIS Engine开发碰到问题及解决方式

    1.问题描述——运行提示:ArcGIS version not specified. You must call RuntimeManager.Bind before creating any Arc ...

  8. js增删class的方法

    接下来我来介绍两种方法 我们先来一段HTMl代码 <div id="bb"> 你好呀 </div> 接下来我们再来一段css样式 .ob { color:r ...

  9. 浅谈python的第三方库——numpy（三）

    numpy库中矩阵的常用方法 1 矩阵转置 从上图可以看出:使用方法a.T可以将矩阵a转置. 2 均值与方差 注意:方法a.mean()会对矩阵a的所有元素求均值,a.var()也是考虑矩阵a的所有元 ...

  10. Linux——基础之vi编辑器，编辑器之神！

    VI编辑器是什么? 我们学了怎么多的命令,都是为了我们的linux系统和远程操作的方便,那么我们现在怎么,编辑服务器上的文件和软件呢? 换句话说,就是我们如何通过命令行去完成文本和代码的编写,和系统的 ...