axios 介绍

axios 介绍

axios 是一款基于 javascript xhr 进行封装的插件,自己通过 xhr 进行编写 ajax 请求,实现起来逻辑比较复杂,axios 封装后将复杂的逻辑写在插件的内部,我们用户只需要关心如何调用即可。对我们的开发带来了很大的便捷。

安装

:::warning 注意

在 webpack 案例的基础上进行 axios 实现,请保留上个案例的代码。如需要请查看 搭建本地开发服务器

:::

通过命令安装 axios 插件

sh 复制代码
$ yarn add axios

使用

main.js 文件中编写 axios 代码。

javascript 复制代码
import axios from 'axios'

const p1 = axios({
    method: 'post',
    url: 'https://study.noxussj.top/api/login',
    data: 'account=test&password=123456',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
    }
})

p1.then((res) => {
    console.log(res.data)
})

通过 npx webpack-dev-server 命令运行项目预览效果,同时在浏览器中按 F12 打开调试工具。

可以看到接口请求成功了。

原文链接:菜园前端

相关推荐
盖丽男17 分钟前
彻底搞懂:前端MVVM、后端MVC、DDD极致面向对象的区别与落地真相
前端·mvc
澄江静如练_22 分钟前
vue2中使用provide和inject出现的问题
前端·vue
Mr数据杨1 小时前
【Codex】用PPT文案额外描述优化课件生成细节
java·javascript·django·powerpoint·codex·项目开发
星辰徐哥1 小时前
表单优化:AI驱动HTML5表单的智能验证与提示功能
前端·人工智能·html5
普通网友1 小时前
HTML5新增了哪些重要标签?多多学习也是成长的一部分
前端·学习·html5
2501_906467631 小时前
html5网页中如何实现内网大文件的加密下载?
前端·html·html5·vue上传解决方案·vue断点续传·vue分片上传下载·vue分块上传下载
极客小俊1 小时前
【从零到一】用HTML5+CSS+JavaScript实现一个属于自己的mp3免费音乐播放器 (4) JS交互功能(音乐进度条)
javascript·css·html5·前端开发·免费教程·代码案例·手搓音乐播放器
何何____2 小时前
css变换语法介绍及案例展示
前端·css
冴羽yayujs2 小时前
GitHub 前端热榜项目 - 日榜(2026-05-07)
前端·github
深蓝海拓2 小时前
用HSL颜色系统改造qdarkstyle样式表库
前端·笔记·python·qt·学习