【vue】封装axios（ts）

最新推荐文章于 2025-04-17 22:21:51 发布

阿庭

最新推荐文章于 2025-04-17 22:21:51 发布

阅读量1.3k

点赞数

分类专栏：小问题 vue

本文链接：https://blog.youkuaiyun.com/weixin_43606809/article/details/108026246

版权

小问题同时被 2 个专栏收录

61 篇文章

订阅专栏

vue

31 篇文章

订阅专栏

文件结构

在这里插入图片描述

https.ts

import axios from 'axios'
const ConfigBaseURL = 'https://www.yidong2018.cn/demand' //默认路径，这里也可以使用env来判断环境
//使用create方法创建axios实例
export const Service = axios.create({
  timeout: 5000, // 请求超时时间
  baseURL: ConfigBaseURL,
  method: 'post',
  headers: {
    'Content-Type': 'application/json;charset=UTF-8'
  }
})
//转换类型
declare module 'axios' {
  interface AxiosInstance {
    (config: AxiosRequestConfig): Promise<any>
  }
}
export default Service;

user.ts

import Service from './https'

export function login(loginForm: any) {
    return Service({
        url: '/user/login',
        data: {
            account: loginForm.account,
            password: loginForm.password
        }
    })
}

使用

import { login } from "../utils/user";
const res = await login(this.loginForm);
console.log(res);
if(res.code!==200){
//coding...
}