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

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

原文链接:菜园前端

相关推荐
3824278274 小时前
JS表单提交:submit事件的关键技巧与注意事项
前端·javascript·okhttp
Kagol4 小时前
深入浅出 TinyEditor 富文本编辑器系列2:快速开始
前端·typescript·开源
interception4 小时前
js逆向之京东原型链补环境h5st
javascript·爬虫·网络爬虫
木土雨成小小测试员4 小时前
Python测试开发之前端二
javascript·python·jquery
小二·4 小时前
Python Web 开发进阶实战:Flask-Login 用户认证与权限管理 —— 构建多用户待办事项系统
前端·python·flask
浩瀚之水_csdn4 小时前
python字符串解析
前端·数据库·python
全栈小54 小时前
【前端】在JavaScript中,=、==和===是三种不同的操作符,用途和含义完全不同,一起瞧瞧
开发语言·前端·javascript
如果你好4 小时前
Vue createRenderer 自定义渲染器从入门到实战
前端·javascript·vue.js
温宇飞4 小时前
Web 图形合成技术:Blending 与 Porter-Duff Compositing
前端
小高0074 小时前
读懂 Tailwind v4:为什么它是现代前端项目的必选项?
前端·javascript·vue.js