二次封装axios时刻意服务端模拟了延迟返回数据的场景,用return Promise.reject(error) 返回异常,报如下错误,

[Vue warn]: Error in v-on handler (Promise/async): "Error: timeout of 5000ms exceeded"

export default class Page1 extends Vue {
private async getList() {
const {data,pagination} = await getArticles(this.listQuery)
console.log('data: ',data)
console.log('pagination: ',pagination)
}
}

解决办法:用 try{} catch(e){} 包裹处理方法

export default class Page1 extends Vue {
private async getList() {
try {
const {data,pagination} = await getArticles(this.listQuery)
console.log('data: ',data)
console.log('pagination: ',pagination)
} catch (e) {
console.log(e.message)
}
}
}

typescript开发vue项目二次封装的axios用return Promise.reject(error) 返回异常,提示[Vue warn]: Error in v-on handler (Promise/async)的更多相关文章

  1. element el-table表格的vue组件二次封装(附表格高度自适应)

    基于vue的el-table表格二次封装组件方法 前言 在公司实习使用vue+element-ui框架进行前端开发,使用表格el-table较为多,有些业务逻辑比较相似,有些地方使用的重复性高,如果多 ...

  2. 三、VUE项目BaseCms系列文章:axios 的封装

    项目开发中 ajax 是不可缺少的,一个好的封装可以减少我们很多的重复代码,维护也更方便.在 vue 开发中我们用的比较多的就是 axios.下面代码是项目中用到的 axios 的封装. http.j ...

  3. 利用maven开发springMVC项目(二)——框架配置

    申明:主要内容来源于大神博客(使用IntelliJ IDEA开发SpringMVC网站(二)框架配置),我只是用eclipse自己练习使用,记录下来也只是为了学习使用,没有任何的商业用途,侵权必删. ...

  4. 使用Spring Boot开发Web项目(二)之添加HTTPS支持

    上篇博客使用Spring Boot开发Web项目我们简单介绍了使用如何使用Spring Boot创建一个使用了Thymeleaf模板引擎的Web项目,当然这还远远不够.今天我们再来看看如何给我们的We ...

  5. 在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知

    需求来源:向后台请求数据时后台挂掉了,后台响应就出现错误,不做处理界面就卡住了,这时需要在main.js中使用axios的响应拦截器在出现相应错误是给出提示.项目使用element-ui,就调用里面的 ...

  6. vue项目通过webpack打包生成的dist文件放到express环境里运行(vue+webpack+express)

    1.首先需要的原料肯定是vue打包生成的dist文件 在vue项目目录下运行:npm run build,等待运行结束,会在项目目录下生成一个dist文件夹,里面会生成一些文件(如下图示) 小的项目文 ...

  7. Vue项目二、vue-cli2.x脚手架搭建build文件夹及config文件夹详解

    build文件夹下 build.js 'use strict' // js的严格模式 require('./check-versions')() // node和npm的版本检查 process.en ...

  8. Vue项目二、vue环境搭建以及Vue-cli使用及详解

    一.Vue多页面应用的环境搭建 每一次页面跳转的时候,后台服务器都会给返回一个新的html文档,这种类型的网站也就是多页网站,也叫做多页应用. 环境的搭建如下,在页面中引入如下框架 <scrip ...

  9. 10.17正式开发stark项目(二)

    2018-10-17 11:09:48 orm补充参考连接: https://www.cnblogs.com/yuanchenqi/articles/8963244.html model 进阶 参考连 ...

  10. Vue(二十三)vuex + axios + 缓存 运用 (以登陆功能为例)

    (一)axios 封装 (1)axios拦截器 可以在axios中加入加载的代码... (2)封装请求 后期每个请求接口都可以写在这个里面... (二)vuex user.js import { lo ...

随机推荐

  1. 3d-force-graph使用及相关设置

    首先安装3d-force-graph模块到项目依赖: npm install 3d-force-graph 在需要使用的vue页面中导入 import ForceGraph3D from '3d-fo ...

  2. 当FTP不能满足大文件、海量文件传输时,有没有好的替代方案?

    很多企业存在大文件.海量文件的传输需求,如涉及到图像数据采集和回传.海量用户数据收集和同步等业务,一般情况,企业还是会采用传统的FTP传输,或者以此为基础,使用脚本或结合其他办公工具来解决传输需求. ...

  3. 把一个元器件的原理图分成多个Part-转载

    (24条消息) [AD20]把一个元器件的原理图分成多个Part_不知道在干嘛每天的博客-CSDN博客_ad中原理图怎么分成几部分 以LM358芯片为例:把LM358原理图的A和B分开画,分成A和B两 ...

  4. STM32F103 的 USART5使用

    STM32F103zet6 的串口5是UART5   不是  USART5

  5. python3+selenium+BeautifulReport生成自动化测试报告

    https://www.jianshu.com/p/3d2c0e092ffb 自动化测试,最重要的还是测试报告,下面就教大家使用BeautifulReport生成自动化测试报告GitHub:https ...

  6. <小李飞刀>系列 随笔

    1.多情剑客无情剑 古龙的作品在电视上只看过电影版的陆小凤传奇,对古龙的作品也没有过系统的了解,初读时听到了李寻欢的名字,突然感觉可惜.觉得如此早就读到这种级别的小说有些暴殄天物,不过也算是以白纸状态 ...

  7. 20192305 王梓全Python程序设计实验一报告

    20192305 王梓全Python程序设计实验一报告 课程:<Python程序设计> 班级: 1923 姓名: 王梓全 学号:20192305 实验教师:王志强 实验日期:2021年4月 ...

  8. 第一次写代码(Hellowold)

    Helloword 新建一个code文件夹,存放代码 新建一个hava文件 文件后缀名为java 编写代码 java ​1.  public class Hello{   public static ...

  9. linux开机自启动tomcat或者其他应用

     开机自启动Tomcat: 1.创建一个脚本,touch tomcat_start.sh 2.编辑脚本,vim tomcat_start.sh #!/bin/sh #chkconfig: 2345 8 ...

  10. 执行Maven的test命令报错

    参考网址:https://blog.csdn.net/weixin_46688566/article/details/126470742 解决方案 在pom.xml文件中加入以下依赖: <plu ...