vue3,axios的基础配置

1.安装axios

npm i axios

2.配置统一接口 1.接口基准地址    2.接口超时时间 3.请求拦截器   4.响应拦截器

在utils中的http.js中

//axios基础封装
//1.导入axios
import axios from "axios";
const httpInstance=axios.create({
    baseURL:'http://pcapi-xiaotuxian-front-devtest.itheima.net',//2.配置基准地址
    timeout:5000//3.配置超时时间
})
//4.拦截器
// axios请求拦截器
httpInstance.interceptors.request.use(config => {
    return config
  }, e => Promise.reject(e))
  
  // axios响应式拦截器
httpInstance.interceptors.response.use(res => res.data, e => {
    return Promise.reject(e)
  })
  
export default httpInstance

   

3.如果一个项目有多个基准地址怎么办,多创建几个请求实例即可

const http1=axios.create({
    baseURL:'http://pcapi-xiaotuxian-front-devtest.itheima.net',//2.配置基准地址
    timeout:5000//3.配置超时时间
})

const http2=axios.create({
    baseURL:'http://pcapi-xiaotuxian-front-devtest.itheima.net',//2.配置基准地址
    timeout:5000//3.配置超时时间
})