什么是axios(写给小白的理解笔记)

news2025/2/25 15:26:00

0.为什么会诞生axios

最初浏览器页面向服务器请求数据时,返回的是整个页面,整个页面都会刷新,当我们只需要请求部分数据时,返回整个页面会造成网络资源的占用,为了提高数据请求效率,异步网络请求Ajax出现了,它可以在页面无刷新的情况下请求数据。jQuery封装的ajax,原生的XMLHttpRequest,以及axios都可以实现异步网络请求。

Axios(相比于原生的XMLHttpRequest对象来说) 简单易用,(相比于jQuery)axios包尺寸小且提供了易于扩展的接口,是专注于网络请求的库。(axios本质上是原生XMLHttpRequest的封装)

1.什么是Axios

Axios 是一个基于 promise 的网络请求库,可以用于浏览器和 node.js

Axios(相比于原生的XMLHttpRequest对象来说) 简单易用,(相比于jQuery)axios包尺寸小且提供了易于扩展的接口,是专注于网络请求的库。

2.axios发起GET请求

      2.1 axios发起GET请求的语法:
   

axios.get('url',{ params: { /*参数*/ } }).then(callback)

      2.2 axios发起GET请求的具体实例与基本使用

 

       

3.axios发起POST请求

     3.1 axios发起POST请求的语法:

axios.post('url', { /*参数*/ }).then(callback)

      3.22.2 axios发起POST的具体实例与基本使用

 

4.直接使用Axios发起请求 

axios 也提供了类似与jQuery中$.ajax()的函数,语法如下: 

4.1  axios直接发起GET请求的语法与实例:

 

 

4.1  axios直接发起POST请求的语法与实例:

 

 5.关于axios还有什么疑问吗?可以在评论区留言,希望有大神来回答~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/405540.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

羊了个羊网页版

最近羊了个羊火的不得了,利用周末时间实现一个网页版。步骤如下: 1,用reactjs 实现。 2,实现Gameroom类。 3,实现Card类。 4,通过父组件控制子组件通信方式,控制点击事件。 5,通过t…

nvm切换node版本

在实际的前端开发过程中,可能会经常遇见 node.js 的版本问题,不同的项目需要使用不同的 node.js 版本。比如Vue2和Vue3需要的Node版本不一样。 地址:https://github.com/coreybutler/nvm-windows/releases 注意:安装之前必须完…

ChatGPT初体验——震撼,好用,贾维斯已来

2022.12.26 大概一个月的使用体验,我觉得chagpt的使用还算远远超出我的想象,可以说只有你想不到的,最近需要写一个基于shell的学生选课系统,但是时间实在是紧张的很,一开始chatgpt是无法接受这么大的要求的&#xff0c…

js实现数组去重的方式(7种)

目录JS数组去重的方式1.利用Set()Array.from()2.利用两层循环数组的splice方法3.利用数组的indexOf方法4.利用数组的includes方法5.利用数组的filter()indexOf()6.利用Map()7.利用对象JS数组去重的方式 例:将下面数组去除重复元素(以多种数据类型为例&a…

vue开发中,数据更新,但视图不刷新

我们在开发过程中会碰到数据更新,但是视图并未改变的情况,情况如下: 第一种:动态给对象新增属性或者删除属性是不会触发视图刷新的,Vue识别不到; 第二种:通过数组下标修改数组中的元素或者手动修改数组的长度,Vue识别不到&#…

【Javaweb学习笔记】在Eclipse中创建Web项目

【Javaweb学习笔记】在Eclipse中创建Web项目 哈喽大家好,这里是Java框架学习笔记专栏第二期 本期内容——在Eclipse中创建Web项目 前期回顾: 第一期——schema约束 笔者还是菜菜,还请大家多多指教呀! 文章目录【Javaweb学习笔记】…

解决onebot提示当前QQ版本过低,请升级到最新版在登录!

文章目录前言方法一方法二1️⃣下载文件2️⃣本地运行3️⃣重新启动go-cqHttp4️⃣服务器下载go-cqhttp5️⃣配置gocqhttp6️⃣启动go-cqhttp结语前言 🥇个人主页:MIKE笔记 🥈文章专栏:技术教程 📣TG交流群&#xff1a…

vue:聊天对话框的实现

实现效果:不知道怎么录屏 就用图片展示了,实现了聊天框的基础功能,也有一些细节考虑不完全。未输入消息时可发送图片或视频,输入消息后显示发送按钮,保持滚动条在位于底部的最新消息。 实现方式: 1.布局&a…

React中的setState使用细节和原理解析

文章目录setState使用详解使用setState的原因setState的基本用法setState的异步更新setState获取异步结果setState一定是异步?setState使用详解 前面我们有使用过setState的基本使用, 接下来我们对setState使用进行详细的介绍 使用setState的原因 开发中我们并不能直接通过修…

vue项目打断点的三种方式

方式一:使用debugger介绍:js自带的方法优点:简单好用,不需要额外的配置注意:生产环境下需要去掉方式二:使用vsCode插件断点介绍:vscode集成的断点调试,大佬必备优点:减少…

Nodejs安装及npm配置(超详细)

文章目录一、Node.js 下载二、Node.js 安装node.js简单安装三、Node.js 配置配置npm源关于npm源的更新四、可能遇到的问题1. 直接输入npm 或 npm 命令出错一、Node.js 下载 Node.js官网下载地址 Node.js中文下载地址 本文以 node.js 16.14.2 版本做演示,此版本要…

vue如何请求后端数据

在vue中,我们如何通过请求接口来访问后端的数据呢?在这里简单总结了一个小示例: 主要问题:如果不封装的话,在每次请求的时候都要书写一遍下面的代码,造成代码冗余。 1、在src目录下创建一个utils文件夹&am…

uniapp h5跳转微信小程序(wx-open-launch-weapp)

目录 一、注意事项 二、使用步骤 三、调整样式 一、注意事项 微信版本要求为:7.0.12及以上系统版本要求为:iOS 10.3及以上、Android 5.0及以上已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。…

vue项目网页自适应,等比例放大缩小

同样是,虽然标题写的vue项目适用,但其它前端框架应该也可以。其它框架我没什么经验,可以参考着看看,应该适用。 本文章不涉及第三方插件,纯js。 自适应这个问题,老早以前就有一个解决方式,css中…

前端实现vue3使用axios调用后端接口

前言:在探索vue3.0的道路上调接口这件事很重要,所以我就把我探索出来的这条道展示出来,为大家提供便利,望喜欢,废话不多说展示!!! 第一步:在src下创建一个http文件夹&am…

vue-devtools的安装与使用

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录前言一、vue-devtools是什么?二、vue-devtools安装1.下载vue-devtools工具2.安装vue-devtools工具三、vue-devtools的使用总结前言 主要介绍vue-devtool…

nvm详细安装步骤以及使用(window10系统)

nvm详细安装步骤以及使用 nvm是一个管理nodejs版本的工具。在实际的开发中,有些项目的开发依赖需要低版本的nodejs运行环境,此时我们就需要使用nvm来降低nodejs版本。 1.下载安装nvm,首先安装目录不要有空格和中文,会出现乱码 下…

若依框架详细使用

目录 🏳‍🌈若依是用来干什么的❓ 🚩技术支持: 🏳‍🌈如何下载❓ 🚩官网地址: 🏳‍🌈如何搭建ruoyi环境❓ 🚩若依框架的目录结构 🚩 修改配…

WKHtmltoPdf

踩过的坑 请一定要使用下面的这种方式获取系统的可执行命令,否则会报一堆的找不到目录等错误!!! String osname System.getProperty("os.name").toLowerCase();String cmd osname.contains("windows") ? …

如何运行vue项目(超详细图解)

📖本篇超级详细案例截图教学 如何运行别人的vue项目,图片点击可放大仔细看 一、查看node.js版本 Vue环境配置教程 :https://blog.csdn.net/m0_57545353/article/details/124366678 配置完成后分别在cmd中执行node -v查看是否安装成功&…