Vue axios http Request 请求封装

没有封装的请求方式
import axios from 'axios'

axios.get(/my/adminList?pageSize=${params.pageSize}&page=${params.page}).then(res=>{
    console.log(res.data)
}).catch(err=>{
    return Promise.reject(err)
})
          

在utis文件夹下新建http请求文件http.js
import axios from "axios";
import store from "@/store";
let server = axios.create({
    // 请求公共地址
    baseURL: "http://127.0.0.1:8080",
    // 超时时间
    timeout: 5000,
})
// 添加请求拦截器
server.interceptors.request.use(config=>{
    // 在发送请求之前做些什么
    if(true){
      config.headers={'Content-type': 'application/json',Authorization:store.state["X-Token"]}
    }
    return config;
  }, function (error) {
    // 对请求错误做些处理
    // console.log(error,"相应1")
    return Promise.reject(error);
  });
// 添加响应拦截器
server.interceptors.response.use((response)=>{
    // 对响应数据做点什么操作
    
    return response;
  }, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
  });

export default server

在api文件夹下新建接口请求文件index.js

import server from "../utis/http.js"; 

export const getadminList = (params) => {
    return server({
        url: `/my/adminList?pageSize=${params.pageSize}&page=${params.page}&pageNum=${params.pageNum}`,
        method: "get" ,   
        data: params
    })
}

在组件中使用

import {getadminList} from"@/api/index"


getAdmin(){
    getadminList(this.page).then(res=>{
          console.log(res.data)
    }).catch(err=>{
          return Promise.reject(err)
    })
}