通常数据都在URL传参,params:data前端
eg: Request URL:http://api.anjianba.cn/api/Training/Query
或者Request URL:http://api.anjianba.cn/api/Training/Query/23
ios
{ name:"Myname", { types:[1,3], forms:[2,5] } }
若是传递比较复杂的数据时,Query String Parameters,后台不喜欢处理这种数据json
正常的处理以后:Request URL:http://api.anjianba.cn/api/Training/Query?planName=&startTime=&endTime=&types[]=1&types[]=3
axios
须要这种形式的:Request URL:http://api.anjianba.cn/api/Training/Query?planName=&startTime=&endTime=&types=1&types=3
api
在jQuery中是设置 traditional:true
,便可转换为如上数据类型。
axios的config中设置:浏览器
get(url, data = {}, options = {}) { let config = { params: data, headers: { 、、、 },{ 'paramsSerializer': function(params) { return qs.stringify(params, { indices: false }) // return qs.stringify(params, { arrayFormat: "repeat" }) }, ...options } return new Promise((resolve, reject) => { axios.get(url, config) .then(response => { resolve(response.data); }) .catch((error) => { reject(error); }) }) }
提交这种复杂类型数据:网络
{ name:"Myname", { types:[1,3], forms:[2,5] } }
json
,
'Content-Type':'application/json'
JSON.stringify(data)
json字符串FormData
类型的
'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'
序列化:qs.stringify(data)
ids[]=27&ids[]=26
==> ids%5B0%5D=27&ids%5B1%5D=26
app
注意:谷歌浏览器最多有6个请求并行,简而言之,你能够取消请求,前端不接受请求,可是请求资源一旦占用,pending状态结束前不可以使用 window._axiosPromiseArr=[]; //设置cancel函数 config.cancelToken = new axios.CancelToken(cancel=>{ window._axiosPromiseArr.push({cancel}); }); //手动cancel window._axiosPromiseArr.forEach((el,index)=>{ el.cancel(); }); window._axiosPromiseArr = [];
最后感谢夏大师的一块儿讨论研究,为本文成稿作出重要贡献函数