axios二次封装初阶

新建request.ts

import axios from 'axios';

let axiosOption = {
    baseURL:"http://xxx.xxx.xxx.xxx:8080",
    timeout:3000
}

// 创建一个单例
const instance = axios.create(axiosOption);

// 添加请求拦截器
instance.interceptors.request.use(function (config) {
  ...
  // 可以在此注入token
  ...
  return config;
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error);
});

// 添加响应拦截器
instance.interceptors.response.use(function (response) {
  // 对响应数据做点什么
  // console.log(response.data);
  return response.data;
}, function (error) {
  // 对响应错误做点什么
  return Promise.reject(error);
});

export default instance;

新建api.ts

import instance from './request';

// 一级分类
export const getTypeOne = (params:any)=>instance.get('/api/getTypeOne',{params});

// 商品列表
export const goodLists = (params:any)=>instance.get('/api/goodList',{params});

// 二级分类
export const getTypeTwo = (params:any)=>instance.get('/api/getTypeTwo',{params});

// 分类商品列表
export const getTypeTwoList=(params:any)=>instance.get('/api/getTypeTwoList',{params});

...
..
.

使用：

// 引入
import { goodLists} from '../../api/api'

goodLists({
   page:1  // 传给服务器的参数
}).then((datas:any)=>{
   // datas服务器返回的数据
});