首页 > 编程 > JavaScript > 正文

vue 组件的封装之基于axios的ajax请求方法

2019-11-19 13:17:16
字体:
来源:转载
供稿:网友

如下所示:

import Vue from 'vue' let service = { url: 'http://host.xxxxx.com/xxx.php'} service.ajaxReuqest = (url, options, type, fileFlag) => { for (const i in options) { if (!options[i] && options[i] !== 0 && (options[i].length && options[i].length > 0)) {  delete options[i] } } let promise = new Promise((resolve, reject) => { if (fileFlag) {  Vue.axios.post(url, options, {  headers: {   'Content-Type': 'multipart/form-data'  }  }).then((res) => {  resolve(res)  }) } else if (type === 'GET') {  Vue.axios.get(url, { params: options }).then((res) => {  resolve(res.data.resultObj)  }).then((err) => {  reject(err)  }) } else {  Vue.axios.post(url, options).then((res) => {  resolve(res)  }).then((err) => {  reject(err)  }) } }) return promise}

支持POST GET请求以及图片上传,基于axios,适用于vue,

以异步获取省份列表作为例子:

// 获取省份信息service.getProvinceList = (options) => { return service.ajaxRequest(service.url + '/basic/getProvinceList', options, 'POST')}
getProvinceList () { service.getProvinceList({}).then((res) => {  this.provinceList = res.data.resultObj.data })}

以上这篇vue 组件的封装之基于axios的ajax请求方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持武林网。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表