axios在Vue3中的使用实例代码
更新时间：2023年07月04日 14:34:06 作者：velpro_!
Axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js，这篇文章主要介绍了axios在Vue3中的使用,需要的朋友可以参考下
Axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js。它可以在浏览器中发送异步请求，也可以在Node.js中发送HTTP请求。Axios可以处理HTTP请求和响应，支持拦截器、取消请求、自动转换JSON数据等功能。在Vue3中，Axios是一个常用的HTTP请求库。
1. 安装：npm install axios
2. 配置基础实例
// utils/http.js
import axios from "axios";
// 创建实例
const httpInstance = axios.create({
baseURL:'https://pcapi-xiaotuxian-front-devtest.itheima.net',
timeout:5000
})
// 如果项目里需要得到接口基地址不同，可以这样做
// axios.create()方法可以执行多次，每次执行就会生成一个新的实例
// const httpInstance2 = axios.create({
// baseURL:'url2', // 基地址
// timeout:5000 // 超时器
// })
//拦截器
httpInstance.interceptors.request.use(config=>{
return config
},e=>Promise.reject(e))
//响应器
httpInstance.interceptors.response.use(res=> res.data,e=>{
return Promise.reject(e)
})
// 导出
export default httpInstance3.
// apis/testApi.js
import httpInstance from "@/utils/http";
export function getCatefory(){
return httpInstance({
url:'home/category/head'
})
}4. 使用
import {getCatefory} from '@/apis/testApi'
getCatefory().then(res=>{
console.log(res)
})到此这篇关于axios在Vue3中的使用的文章就介绍到这了,更多相关axios在Vue3使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue获取光标位置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
script setup是vue3的新语法糖,并不是新增的功能模块,只是简化了以往的组合式API必须返回(return)的写法,并且有更好的运行时性能,这篇文章主要给大家介绍了关于Vue3.2中setup语法糖的相关资料,需要的朋友可以参考下2021-12-12
这篇文章主要介绍了Vue项目判断开发、测试、正式环境过程，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本文主要介绍了vue实现通过手机号发送短信验证码登录的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-05-05
这篇文章主要介绍了vue使用moment如何将时间戳转为标准日期时间格式问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-05-05
如何使用 Vue Router 的 meta 属性实现多种功能
在Vue.js中,Vue Router 提供了强大的路由管理功能,通过meta属性,我们可以在路由定义中添加自定义元数据,以实现访问控制、页面标题设置、角色权限管理、页面过渡效果,本文将总结如何使用 meta 属性来实现这些常见的功能,感兴趣的朋友一起看看吧2024-06-06
这篇文章主要为大家详细介绍了Vue3中的Excel数据管理,即下载模板并导入数据功能的实现,文中的示例代码讲解详细,感兴趣的小伙伴可以参考一下2024-05-05
在 Vue 中,v-model 是一个常用的指令,用于实现表单元素和组件之间的双向绑定,当我们使用原生的表单元素时,直接使用 v-model 是很方便的,本文给大家介绍了Vue自定义组件实现 v-model 的几种方式,需要的朋友可以参考下2024-02-02
我们正常在开发项目中,表格的风格是一致的,但是表格或多或少会有些不同,有些是需要分页,有些是按钮功能不同,有些又需要加Tag,或者对时间进行格式化等,这篇文章主要介绍了elementPlus表格二次封装过程,需要的朋友可以参考下2024-07-07
父组件使用 props 把数据传给子组件，子组件使用 $emit 触发父组件的自定义事件，今天通过示例给大家详细介绍下Vue 关于$emit与props的使用，感兴趣的朋友一起看看吧2022-03-03
最新评论