---
title: vue3项目中极简axios封装与应用
description: axios在前端项目中作为一个网络请求库，它可以运行在浏览器和node.js环境中，因此非常的流行。极简axios封装与应用，在日常开发的简单应用中即可拿来主义
author: chaihongjun
category: frontend
published: 2024-12-17
url: https://chaihongjun.me/frontend/39.html
---

# vue3项目中极简axios封装与应用

axios在前端项目中作为一个网络请求库，它可以运行在浏览器和node.js环境中，因此非常的流行。vue3项目中极简axios封装与应用，在日常开发的简单应用中即可拿来主义直接使用。

首先是在项目跟了目录中安装axios和element-plus组件库
MDBLOCK0
然后在src目录创建/request/index.js文件：

MDBLOCK1
接着写API调用，在src目录创建/api/index.js文件:
MDBLOCK2
上面的代码就完成了API请求的封装。

在实际项目应用中，可能会把API请求的数据保存到store中：
MDBLOCK3
在组件内：

MDBLOCK4
组件引入Store实例之后，可以在组件内使用相应的State和Actions。

---

> 本文首发于 [chaihongjun.me | 柴宏俊 web 技术学习笔记](https://chaihongjun.me/frontend/39.html)，采用 CC BY-NC-ND 4.0 协议，转载请保留出处与链接。