vue项目封装通用axios

---

前言

如何在vue项目中封装通用的axios呢?为什么要封装呢？直接发请求不好吗？封装后有什么好处呢？你是否同样有这样的疑问呢？一起跟随本文的脚步来看看如何封装一个通用的axios吧~

---

一、为什么需要封装axios？

• 统一管理基地址
• 对请求、响应进行处理
• 方便向后台服务器发送请求，减少冗余代码

二、如何封装？

1. 安装依赖

在vue项目根目录下打开任意终端窗口,运行如下命令
npm install axios

2. 封装

注：文件名自定义，utils目录下方常用的工具函数。

在src/utils目录下新建request.js文件

代码如下（示例）：

import axios from 'axios'

// 接口调用基准路径
export const base = ''

// 创建一个独立的实例对象
const instance = axios.create({
   
    baseURL: baseURL
})

export default (options) => {
   
    return instance({
   
        // 默认 get
        method: options.method || 'GET',
        url: options.url,