vue3如何使用下裁和封装axios

第二部axios封装

先创一个文件夹叫api里面分别代表有：  api.ts,      http.ts

api.ts里面写：

import axios from "axios";

axios.defaults.timeout = 30000;

// axios.defaults.baseURL = process.env.VUE_APP_API_URL;

axios.defaults.baseURL = 'https://www.zzgoodqc.cn/';

// if(process.env.VUE_APP_MODE==='development'){

//  console.log('开发');

// }else if(process.env.VUE_APP_MODE==='test'){

//  console.log('测试');

// }else{

//  console.log('正式');

// }

// 添加响应拦截器

axios.interceptors.response.use(function (response) {

  //可以写if判断，提前拦截错误信息

  return response;

}, function (err) {

  return Promise.reject(err);

});

export function apiGet(url: any, data: any) {

  return new Promise((resolve, reject) => {

    axios({

      method: "get",

      data,

      url,

    }).then(

      (value) => {

        resolve(value.data);

      },

      (reason) => {

        reject(reason);

      }

    );

  });

}

export function apiPost(url: any, data: any) {

  return new Promise((resolve, reject) => {

    axios({

      method: "post",

      url,

      data,

    }).then(

      (value) => {

        resolve(value.data);

      },

      (reason) => {

        reject(reason);

      }

    );

  });

}

http.ts写

import { apiGet } from "./api";

export function getCode(data: any) {

  return new Promise<any>((resolve, reject) => {

    apiGet('index.php/index/index/getcode', data).then((res: any) => {

      resolve(res)

    })

  })

}

export { apiGet };

第三部：