vite_vue3 封装axios

1、新建request文件夹 indexed.js 文件

import axios from 'axios'

const service = axios.create({
    baseURL: "http://ningdongyunying.nxjiewei.com:8011/api",

    headers: {
        'Content-Type':'application/json;charset=UTF-8',
        'Content-Type':'application/x-www-form-urlencoded',
    },
    timeout: 8000
})

// 请求拦截器
service.interceptors.request.use(config => {
    config.headers.token = 'token';
    return config
})

// 响应拦截器
service.interceptors.response.use(res => {
    console.log(res)
    if(res.status == 200){
        console.log("请求成功")
    }
    return res.data
}, (err) => {
    // console.log(err)
    return Promise.reject(err)
})


export default service

2、新建api.js集中管理接口并导出

import service from "./index.js"

// export function article_list(data){
//     return service({
//         method:"get",
//         url:"/article/list",
//         data
//     })
// }

export const article_list = (params)=>{
    return service({
        url:"/article/list",
        data:params
    })
}

3、页面中使用

import { article_list } from "./request/api"
// async function api_test(){
//     let res = await article_list({

//     })
//     console.log(res)
// }

function api_test(){
    article_list({

    }).then((res)=>{
      console.log(res)
    })
}

onMounted(() => {
  api_test()
})