axios vue 动态date_在vue中axios设置timeout超时的操作

在做vue项目的时候，由于数据量查询比较大，所以前台调用接口数据的时候，往往要等很久，所以需要设置个超时，当超过设置时间就让向页面返回一个状态，让使用者不用一直等。

通过官网api查询，对其超时讲解不是很多，但其和Jquery中请求非常类似

Jquery请求方式

$.ajax({

url: '接口地址',

type:'get', //请求方式get或post

data:{}, //请求所传的参数

dataType: 'json', //返回的数据格式

timeout: 4000, //设置时间超时，单位毫秒

success: function(result) {

console.log('OK')

},

error: console.log('error')

})

vue中请求方式：

axios.post( //请求方式

url, //接口地址

params, //传递参数

{timeout: 1000 * 60 * 2}) //设置超时，单位毫秒

.then(function(res){

console.log(res);

}).catch((error) => {

console.log('error')

})

所以可以再请求中通过timeout设置请求超时

补充知识：vue中用axios请求接口，处理网络失败和网络超时问题,axios拦截器

前端经常要对服务器的错误信息做处理，小编是头一次做，就遇到了很多问题

首先，是封装的请求数据的方法

import Vue from 'vue';

import axios from 'axios';

import qs from 'qs';

import wx from 'weixin-js-sdk';

import {

Toast

} from 'mint-ui';

axios.defaults.timeout = 10000;

// 拦截

axios.interceptors.request.use(function (config) {