vue 2.x 中axios 封装的get 和post方法

 更新时间:2018年02月28日 14:07:32   作者:浮缠  
本文通过实例代码给大家介绍了vue 2.x 中axios 封装的get 和post方法,非常不错,具有参考借鉴价值,需要的朋友参考下吧

vue 2.x axios 封装的get 和post方法

import axios from 'axios'
import qs from 'qs'
export class HttpService {
  Get(url, data) {
    return new Promise((resolve, reject) => {
      axios.get(url, {
        params: data
      }).then((res) => {
        if (res) {
          //成功回调
          resolve(res);
        }
      }).catch((error) => {
        reject(error);
      })
    })
  }
  Post(url, data) {
    return new Promise((resolve, reject) => {
      axios.post(url, qs.stringify(data), {
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded',
          'Accept': 'application/json'
        }
      }).then((res) => {
        if (res) {
          //成功回调
          resolve(res);
        }
      }).catch((error) => {
        reject(error);
      })
    })
  }
}

 postfile方法

PostFlie(url, data) {
    return new Promise((resolve, reject) => {
      //根据data对象生成FormData对象
      var temp = new FormData();
      for (var t in data) {
        temp.append(t, data[t]);
      }
      axios.post(url, temp).then((res) => {
        if (res) {
            resolve(res.Data);
        }
      }).catch((error) => {
        reject(error);
      })
    })
  }

总结

以上所述是小编给大家介绍的vue 2.x 中axios 封装的get 和post方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • el-table树形表格表单验证(列表生成序号)

    el-table树形表格表单验证(列表生成序号)

    这篇文章主要介绍了el-table树形表格表单验证(列表生成序号),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • vue+iview使用树形控件的具体使用

    vue+iview使用树形控件的具体使用

    这篇文章主要介绍了vue+iview使用树形控件的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • vue 顶部消息横向滚动通知效果实现

    vue 顶部消息横向滚动通知效果实现

    系统顶部展示一个横向滚动的消息通知,就是消息内容从右往左一直滚动,这篇文章主要介绍了vue顶部消息横向滚动通知,需要的朋友可以参考下
    2024-02-02
  • Vue2的路由和异步请求方式

    Vue2的路由和异步请求方式

    这篇文章主要介绍了Vue2的路由和异步请求方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-06-06
  • vue 使用微信jssdk,调用微信相册上传图片功能

    vue 使用微信jssdk,调用微信相册上传图片功能

    这篇文章主要介绍了vue 使用微信jssdk,调用微信相册上传图片功能,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • vue项目打包后请求地址错误/打包后跨域操作

    vue项目打包后请求地址错误/打包后跨域操作

    这篇文章主要介绍了vue项目打包后请求地址错误/打包后跨域操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • Vue动态添加属性到data的实现

    Vue动态添加属性到data的实现

    在vue中请求接口中,一个请求方法可能对应后台两个请求接口,所以请求参数就会有所不同。需要我们先设置共同的参数,然后根据条件动态添加参数属性
    2022-08-08
  • vue3的watch用法以及和vue2中watch的区别

    vue3的watch用法以及和vue2中watch的区别

    这篇文章主要介绍了vue3的watch用法以及和vue2中watch的区别,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-04-04
  • Vue.extend 登录注册模态框的实现

    Vue.extend 登录注册模态框的实现

    这篇文章主要介绍了Vue.extend 登录注册模态框的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-12-12
  • vue如何集成raphael.js中国地图的方法示例

    vue如何集成raphael.js中国地图的方法示例

    最近的数据统计项目中要用到中国地图,也就是在地图上动态的显示某个时间段某个省份地区的统计数据,我们不需要flash,仅仅依靠raphael.js以及SVG图像就可以完成地图的交互操作。本文就给大家介绍了关于利用vue集成raphael.js中国地图的相关资料,需要的朋友可以参考下。
    2017-08-08

最新评论