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 打开调试工具。

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

原文链接:菜园前端

相关推荐
青青家的小灰灰几秒前
Pinia 完全指南:重构你的 Vue 3 状态管理架构
前端·javascript·vue.js
yuki_uix1 分钟前
深入理解 JavaScript Event Loop:从概念到实践的完整探索
前端·javascript
程序员阿峰2 分钟前
WebSocket 原理解析
前端
Lee川5 分钟前
JavaScript 继承进化史:从原型链的迷雾到完美的寄生组合
前端·javascript·面试
米饭同学i5 分钟前
微信小程序实现故事线指引动画效果
前端
阿懂在掘金8 分钟前
为什么写 Vue 强烈建议用 Setup?除了复用,更是代码组织
前端·vue.js
sorryhc18 分钟前
我让 AI 帮我写了一个 Code Agent!
前端·openai·ai编程
工边页字19 分钟前
面试官:请详细介绍下AI中的token,越详细越好!
前端·人工智能·后端
anyup19 分钟前
月销 8000+,uView Pro 让 uni-app 跨端开发提速 10 倍
前端·uni-app·开源
码路飞42 分钟前
热榜全是 OpenClaw,但我用 50 行 Python 就造了个桌面 AI Agent 🤖
java·javascript