来自:https://www.jianshu.com/p/68d81da4e1ad 侵删

import axios from 'axios'
import qs from 'qs' let baseurl = 'http://localhost:8081/api'
function getRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.get(url, {
params: params,
paramsSerializer: params => {
return qs.stringify(params, { indices: false })
}})
thenResponse(req, successCallback, errorCallback)
}
function postRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.post(url, qs.stringify(params, { indices: false }))
thenResponse(req, successCallback, errorCallback)
} function putRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
// var params = new URLSearchParams()
// params.append('status', 0)
let req = axios.put(url, qs.stringify(params, { indices: false }))
thenResponse(req, successCallback, errorCallback)
} function deleteRequest (apiPath, params, successCallback, errorCallback) {
let url = baseurl + apiPath
let req = axios.delete(url, {
params: params,
paramsSerializer: params => {
return qs.stringify(params, { indices: false })
}})
thenResponse(req, successCallback, errorCallback)
} /**
* 请求结果处理
* @param axiosRequest
* @param successCallback
* @param errorCallback
*/
function thenResponse (axiosRequest, successCallback, errorCallback) {
axiosRequest.then((res) => {
if (res.status === 200) {
res = res.data
if (res.code === 0) {
if (successCallback) successCallback(res)
} else {
if (errorCallback) errorCallback(res.code, res.msg)
}
}
}).catch((error) => {
if (errorCallback) errorCallback(-1, error.message)
})
}
export { getRequest, postRequest, putRequest, deleteRequest }

调用

//导入封装axios的js文件
import {getRequest, deleteRequest} from 'utils/api'
//发送delete请求,带数组参数 与 普通参数
deleteRequest('/admin/user/del', {
token: ‘SDFSDIFJSIODFKMSDOFM,SDOPFK’,
ids: [1,2,3,4,5,6]
}, function (res) {
_this.$alert('删除成功')
}, function (errcode, errmsg) {
_this.$alert('code ' + errcode + ' ,meaasge ' + errmsg)
})
//发送GET请求
getRequest('/admin/users', {
status: 0,
pageNum: this.currentPage,
pageSize: count,
token: '111'
}, function (res) {
_this.totalPage = res.data.total
}, function (errcode, errmsg) {
_this.$alert('code ' + errcode + ' ,meaasge ' + errmsg)
})

axios 封装的更多相关文章

  1. axios封装

    前言 作为出入vue的小萌新,我在写请求的时候,也是毫不犹豫写了ajax,结果肯定是不行的... Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2. ...

  2. vue2.0 axios封装、vuex介绍

    一.前言 博主也是vue道路上的行者,道行不深,希望自己的东西能对大家有所帮助.这篇博客针对 了解过vue基础,但是没有做过vue项目的童鞋.如果想看基础指令,可以看我之前的一篇博客,请点击  跳转, ...

  3. 把axios封装为vue插件使用

    前言 自从Vue2.0推荐大家使用 axios 开始,axios 被越来越多的人所了解.使用axios发起一个请求对大家来说是比较简单的事情,但是axios没有进行封装复用,项目越来越大,引起的代码冗 ...

  4. vue项目搭建 (二) axios 封装篇

    vue项目搭建 (二) axios 封装篇 项目布局 vue-cli构建初始项目后,在src中进行增删修改 // 此处是模仿github上 bailicangdu 的 ├── src | ├── ap ...

  5. 原生js上传图片遇到的坑(axios封装)

    后台给我写了一个上传图片的接口,自己用form表单测试成功 接口可以正常跳转 测试的代码: <!doctype html> <html lang="en"> ...

  6. vue-cli3中axios如何跨域请求以及axios封装

    1. vue.config.js中配置如下 module.exports = { // 选项... // devtool: 'eval-source-map',//开发调试 devServer: { ...

  7. axios interceptors 拦截 , 页面跳转, token 验证 Vue+axios实现登陆拦截,axios封装(报错,鉴权,跳转,拦截,提示)

    Vue+axios实现登陆拦截,axios封装(报错,鉴权,跳转,拦截,提示) :https://blog.csdn.net/H1069495874/article/details/80057107 ...

  8. 【Vue】axios封装,更好的管理api接口和使用

    在现在的前端开发中,前后端分离开发比较主流,所以在封装方法和模块化上也是非常需要掌握的一门技巧.而axios的封装也是非常的多,下面的封装其实跟百度上搜出来的axios封装或者axios二次封装区别不 ...

  9. vue3.0+vite+ts项目搭建-axios封装(六)

    封装方式一 import axios from 'axios' import qs from 'qs' import { Toast } from 'vant' import Lockr from ' ...

随机推荐

  1. Mysql存储过程历史表备份

    应用背景 SCADA采集系统需要将实时数据存入历史表.问题1:如何更简单的添加历史数据?2.海量历史数据,比如年数据,如何快速筛选 画曲线? 利用mysql的事件,每小时存一次采集数据: 每月备份历史 ...

  2. LeetCode算法题-Unique Morse Code Words(Java实现)

    这是悦乐书的第318次更新,第339篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第186题(顺位题号是804).国际莫尔斯电码定义了一种标准编码,其中每个字母映射到一系 ...

  3. Linux - 修改系统的max open files、max user processes (附ulimit的使用方法)

    目录 1 问题说明 2 修改max open files 3 修改max user processes 4 附录: ulimit命令说明 1 问题说明 Linux 系统默认的max open file ...

  4. 关于MQ,你必须知道的

    我走过最长的路是你的套路 女:二号男嘉宾,假如我们牵手成功后,你会买名牌包包给我吗? 男:那你会听话吗? 女:会 听话. 男:听话 咱不买! OK那么消息队列MQ有什么套路呢?(这个话题转换生硬度连我 ...

  5. mt8665芯片怎么样?联发科mt8665芯片参数介绍

    MediaTek的MT8665是一款高度集成的LTE片上系统(SoC),它包含了先进的功能,例如LTE cat.4.Octa HMP核心在1.5GHz下工作.3D图形(OpenGLES 3.0).13 ...

  6. appium+python搭建自动化测试框架_Tools安装(一)

    作者的配置环境和版本: win10 + python3.6 +  Appium v1.4.16 1.下载node   https://nodejs.org/en/download/, 下载node.j ...

  7. 使用bat脚本永久激活Windows系统

    每次重装完系统后,右下角会提示系统未激活,无法进行一些个性化设置. 在这里我自己写了一个bat脚本用于激活Windows系统.(仅供学习) 文件下载: 链接:https://pan.baidu.com ...

  8. 1、Linux命令随笔

    1 Linux命令总结 2 3 man ==命令帮助; 4 help ==命令的帮助(bash的内置命令); 5 ls ==list,查看目录列表; 6 -ld:查看目录权限; 7 -l:(long) ...

  9. Javascript高级编程学习笔记(98)—— WebGL(4) WebGL上下文(2)

    错误 Javascript与WebGL之间的一个最大区别在于,WebGL的操作一般不会抛出错误 如果希望获取WebGL的错误信息,那么就需要手动调用  gl.getError() 方法 该方法会返回以 ...

  10. Linux系统部署samba服务记录

    Samba(Server Messages Block)是一种linux系统和windws系统之间依靠网络协议共享文件的服务程序,(Samba has provided secure, stable ...