VUE3封装axios调用接口

在src的api文件夹下添加一个request.js

import axios from 'axios';
import { ElMessage } from 'element-plus'

const http = axios.create({
  baseURL: '', // 基础URL
  timeout: 10 * 1000, // 请求超时时间
  // 其他配置...
});
 
// 请求拦截器
http.interceptors.request.use(
  config => {
    // 可以在这里添加认证token等
    // if (store.getters.token) {
    //   config.headers['Authorization'] = `Bearer ${store.getters.token}`;
    // }
    return config;
  },
  error => {
    // 请求错误处理
    return Promise.reject(error);
  }
);
 
// 响应拦截器
http.interceptors.response.use(
  response => {
    // 对响应数据做处理,例如只返回data部分
    console.log(response, "response")
    if (response.status == 200 && response.data.code == 200) {
      return response.data;
    } else {
      ElMessage.error(response.data.msg)
      return Promise.reject(response.data.msg)
    }
  },
  error => {
    // 响应错误处理
    console.log(error, "error")
    return Promise.reject(error);
  }
);
 
export default http;

分模块调用如首页接口:

在src下建立一个home.js

import request from './request';
 
// 合作与留言的接口
export function addContact(data) {
  return request({
    url: '/function/contact/addContact',
    method: 'post',
    data: data
  })
}

使用你的数据接口

引入:

import { listDept } from '../../api/enter'

使用:

onMounted(() => {
    let obj = {
        parentId: 100
    }
    listDept(obj).then(response => {
        response.data.forEach(item => {
            item.hasChildren = Boolean(item.hasChildren)
        })
        deptList.value = response.data
    });
})

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值