Axios简单说明,快速上手
Ajax:异步的JavaScript和XML
作用:
- 数据交换
- 异步交互
Axios:就是对原生Ajax进行封装,简化书写,快速开发
使用逻辑:

首先要安装Axios,可以通过npm在项目中安装:
- 打开命令行工具,进入项目根目录
- 运行以下命令来安装Axios:
npm install axios
- 安装完成后,你可以在项目中引入Axios来发送HTTP请求。在JavaScript文件中引入Axios的方法如下:
const axios = require('axios');
或者如果你是在浏览器环境中使用Axios,你可以通过<script>标签引入CDN:
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
这样就可以开始使用Axios来发送网络请求了。
axios({method:'GET',url:"http://localhost:3000/api/data"}).then((result)=>{ //成功回调函数console.log(result.data);}).catch((err)=>{ //失败回调函数alert(err);});
method:请求方式,GET/POST....
url:请求路径
data:请求数据(POST)
params :发送请求时携带的url参数 如:...?key=val
Axios-请求方式别名
为了方便起见,Axios已经为所有支持的请求方法提供了别名
在Axios中,可以通过提供不同的方法来发送不同类型的HTTP请求。下面是一些常用的Axios请求别名方法:
axios.request(config):发送自定义请求,可以定义请求的方法、URL、请求头、请求体等配置。
axios.request({method: 'post',url: 'https://api.example.com/custom_request',data: {key: 'value'}
})
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});
axios.get(url[, config]):发送GET请求,配置可以包括params、headers等。
axios.get('https://api.example.com/get_data', { params: { id: 123 } })
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});
axios.delete(url[, config]):发送DELETE请求,可以设置URL和请求配置。
axios.delete('https://api.example.com/delete_data', { params: { id: 456 } })
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});
axios.post(url[, data[, config]]):发送POST请求,同时可以传递请求体数据和配置。
axios.post('https://api.example.com/post_data', { key: 'value' }, { headers: { 'Content-Type': 'application/json' } })
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});
axios.put(url[, data[, config]]):发送PUT请求,可以传递URL、请求体数据和配置。
axios.put('https://api.example.com/put_data', { key: 'value' })
.then(response => {console.log(response.data);
})
.catch(error => {console.error(error);
});
通过使用这些请求别名方法,你可以更加方便地发送不同类型的HTTP请求。
输出先后顺序:
原因:Ajax是异步请求

解决方法:
异步同步化(让代码从上往下按顺序执行)
可以通过async、await可以让异步变为同步操作。async就是来声明一个异步方法,await是用来等待异步任务执行

相关文章:
Axios简单说明,快速上手
Ajax:异步的JavaScript和XML 作用: 数据交换异步交互 Axios:就是对原生Ajax进行封装,简化书写,快速开发 使用逻辑: 首先要安装Axios,可以通过npm在项目中安装: 打开命令行工具…...
云服务器安装宝塔面板部署
单机部署(前端vue项目) 服务器安装宝塔面板 连接到服务器 使用 SSH 连接到你的服务器: ssh rootip安装宝塔面板 运行以下命令来安装宝塔面板: yum install -y wget wget -O install.sh http://download.bt.cn/install/install_6.0.sh sh install.sh安…...
Python 编程题 第九节:二分查找、移动0、旋转字符串、判断子序列
二分查找 双指针查找 无重复数字 lst[1,15,24,36,78,92,101] nint(input()) def binary_search(n,lst):left 0right len(lst) - 1while left<right:mid(leftright)//2if lst[mid]n:return midelif lst[mid]<n:leftmid1elif lst[mid]>n:rightmid-1return -1 print…...
docker-compose部署MongoDB分片集群
前言 MongoDB 使用 keyFile 进行 节点间身份验证,我们需要先创建一个 keyFile 并确保所有副本集的节点使用相同的 keyFile。 openssl rand -base64 756 > mongo-keyfile chmod 400 mongo-keyfiledocker-compose部署分片集群 无密码方式 # docker-compose-mongodb.yml s…...
通义万相 2.1:AIGC 领域的 “王炸” 组合如何颠覆创作生态?
引言 在数字化和人工智能的飞速发展中,AIGC(AI生成内容)技术已经成为推动创作、设计和内容生成领域创新的核心力量。而当通义万相2.1与蓝耘智算平台强强联手,这一“王炸”组合不仅提升了AIGC的效率,还为创作生态带来了…...
elementPlus之日历扩展功能
在这里做个记录,感觉用得还挺多的 功能有如下: 切换月份按钮对应日历视图和中间日期都要变选择日期日历视图要变点击日历视图中的不属于当前选中月份的日期即可触发日历视图变化以及中间日期也要变 代码如下: <template><div clas…...
C# NX二次开发:获取模型中所有表达式并且更新某个表达式的值
大家好,今天要讲的是关于NX中表达式的相关UFUN函数。 UF_MODL_ask_exps_of_part (view source) tag_tpart_tagInputTag of the part to be queriedint *number_of_expsOutputNumber of expressions returnedtag_t * *expsOutput to UF_*free*All the expressions i…...
Ollama本地部署deepseek-r1蒸馏版
Docker安装Ollama 拉取镜像 docker pull ollama/ollama 启动-使用GPU docker run -d --gpusall -p 11434:11434 --name ollama ollama/ollamadocker run : Docker 的核心命令,用于创建并启动一个新的容器。 -d : 后台模式(detached mode)…...
计算机毕业设计:基于web的乡村旅游系统
基于web的乡村旅游系统mysql数据库创建语句基于web的乡村旅游系统oracle数据库创建语句基于web的乡村旅游系统sqlserver数据库创建语句基于web的乡村旅游系统springspringMVChibernate框架对象(javaBean,pojo)设计基于web的乡村旅游系统springspringMVCmybatis框架对象(javaBea…...
c#面试题整理9
1.遍历xml文档 2.解释一下这段 String s new String("xyz"); 这段在C#平台中,编译失败 3.说明一下抽象类 抽象类可以有构造函数 抽象类不能是静态和密封的类,密封的类表示无法继承,抽象类本身就不可实例化,加不好…...
【具身相关】legged_gym, isaacgym、rsl_rl关系梳理
【legged_gym】legged_gym, isaacgym代码逻辑梳理 总体关系IsaacGymlegged_gymrsl_rl三者的关系 legged_gym代码库介绍环境模块env 总体关系 IsaacGym Isaac Gym 是 NVIDIA 开发的一个高性能物理仿真平台,专门用于强化学习和机器人控制任务。它基于 NVIDIA 的 Phy…...
个人学习编程(3-12) 刷题
杨辉三角形: 1 1 1 1 2 1 1 3 3 1 1 4 6 4 1 1 5 10 10 5 1 1 6 15 20 15 6 1 1 7 21 35 35 21 7 1 1 8 28 56 70 56 28 8 1 1 9 36 84 126 126 84 36 9 1 主要是发现规律:一、…...
Java Kryo 序列化与反序列化
Java Kryo 序列化与反序列化 Kryo 是一个高效的 Java 序列化框架,提供比 Java 原生序列化更快、更紧凑的序列化能力。它通常用于缓存、分布式通信和数据存储。 1. 引入 Kryo 依赖 如果你使用的是 Maven,可以添加以下依赖: <dependency><groupId>com.esoteri…...
侯捷C++课程学习笔记:构造函数那些事儿(四)
C 构造函数全面解析 上图节选自爱吃喵的鲤鱼 一、构造函数基础特性 1. 核心功能定位 对象初始化中枢:负责在对象创建时完成成员变量的初始化工作生命周期唯一性:每个对象在其生命周期内仅被调用一次,类似出生证明的签发过程 2. 基础语…...
Java 序列化和反序列化为什么要实现Serializable接口
1. 什么是序列化和反序列化 序列化:将对象的状态信息转换为可以存储或传输的形式(通常是字节序列)的过程。例如,将一个 Java 对象保存到文件中或者通过网络发送给其他程序。 反序列化:将字节序列恢复为对象的过程。比…...
java虚拟机(JVM)以及各种参数详解
Java 虚拟机(JVM)提供了许多参数来调整其行为和性能,以便更好地适应不同的应用场景。理解和使用这些参数对于优化 Java 应用程序的性能非常重要。以下是一些常用的 JVM 参数及其详细说明: 1. 内存管理参数 -Xms<size>&…...
微信小程序审核失败,你的小程序涉及提供播放、观看等服务,请补充选择:文娱-其他视频类目 解决
之前审核的都没有什么问题,结果这次就不给过还提示我们这个。 我们的视频是操作演示的视频。仅用于介绍使用。 是否接受修改指引,勾选我不理解以上内容 再勾选 下面不理解内容异项 申诉理由 视频播放和观看只限于当前用户自己使用,而视…...
电力行业研究系列报告
欧洲风能:2024年统计数据及2025-2030年展望 固态电池全景图:方兴未艾,技术竞逐 电力设备新能源2025年3月投资策略:固态电池产业加速推进,关注GTC大会HVDC电源产品应用趋势 62页PPT了解国内外40家固态电池典型企业技…...
蓝桥杯嵌入式组第七届省赛题目解析+STM32G431RBT6实现源码
文章目录 1.题目解析1.1 分而治之,藕断丝连1.2 模块化思维导图1.3 模块解析1.3.1 KEY模块1.3.2 ADC模块1.3.3 IIC模块1.3.4 UART模块1.3.5 LCD模块1.3.6 LED模块1.3.7 TIM模块 2.源码3.第七届题目 前言:STM32G431RBT6实现嵌入式组第七届题目解析源码&…...
苹果iOS 18.4将强制升级HomeKit架构,旧版设备或无法使用
在科技飞速发展的当下,智能家居领域也在不断革新。而苹果公司作为科技行业的巨头,其每一次动作都备受关注。近日,有消息称苹果计划在iOS 18.4版本中停止对旧版HomeKit架构的支持,这一举措意味着用户将被迫升级,也可能对众多使用Apple Home应用的智能家居设备用户产生深远影…...
dit block部分
我首先会仔细阅读用户指令,明确用户的需求是基于文章的前十页内容,对3.2节“Diffusion Transformer Design Space”中的“DiT block design”部分进行原文翻译,并且在翻译完成后进行总结。为了完成这个任务,我需要先定位到文章的3…...
在MATLAB中实现PID控制仿真
在MATLAB中实现PID控制仿真可以通过代码编程或Simulink图形化建模两种方式完成。以下是两种方法的详细操作步骤和示例: 方法1:使用MATLAB脚本编程(基于控制系统工具箱) 步骤1:定义被控对象的数学模型 假设被控对象是…...
ChebyKAN0、ChebyKAN1 网络阅读
目录 ChebyKAN0 Chebyshev Polynomial-Based Kolmogorov-Arnold Networks: An Efficient Architecture for Nonlinear Function Approximation 参考文献 文章内容 文章详细结构 5. Experiments and Results 5.1 Digit Classification on MNIST 5.2 Function Approximat…...
Python核心模块的高级用法及Linux系统常用命令
一、Python相关 1、正则表达式 (1)正则表达式基础 ①含义:记录文本规则的代码。 ②注意:需要导入re模块 ③特点: 语法比较复杂,可读性较差。通用性很强,适用于多种编程语言 ④步骤&#…...
Spring 框架学习
技术体系结构 总体技术体系 单一架构 一个项目,一个工程,导出为一个 war 包,在一个 Tomcat 上运行,也叫 all in one。 单一架构,项目主要应用技术框架为:Spring、SpringMVC 、Mybatis。 分布式架构 一个…...
Python使用总结之深入理解 asyncio.Future——Python 异步编程的核心基石
深入理解 asyncio.Future:Python 异步编程的核心基石 在现代异步编程中,asyncio.Future 对象是 Python 异步生态系统的底层核心组件之一。它不仅是 Task 的基类,更是所有异步操作结果的统一抽象容器。本文将深入探讨它的设计哲学、运作机制和…...
ubuntu22.04 关于挂在设备为nfts文件格式无法创建软连接的问题
最近遇到情况,解压工程报错,无法创建软连接 但是盘内还有130G空间,明显不是空间问题,查找之后发现是移动硬盘的文件格式是NTFS,在ubuntu上不好兼容,于是报错。 开贴记录解决方案。 1.确定文件格式 使用命…...
pydub AudioSegment入门(基于Pyhton3)
目录 简介核心功能安装与依赖基本用法加载音频文件导出音频文件音频基础操作 简介 pydub 是一个简单易用的 Python 音频处理库,专注于提供高层次的音频操作接口,而 AudioSegment 是它的核心类,用于表示音频片段(如 MP3、WAV、OGG…...
Python精进系列:filter 模块
Python filter 函数:数据筛选的利器 目录 Python filter 函数:数据筛选的利器引言一、filter 函数概述1.1 定义与基本语法1.2 返回值 二、简单示例:筛选偶数2.1 定义过滤函数2.2 使用 filter 函数进行筛选 三、使用 lambda 表达式简化代码3.1…...
LLM预训练过程-简明版本
文章总结自视频:【1080P】安德烈卡帕西:深入探索像ChatGPT这样的大语言模型|Andrej Karpathy_哔哩哔哩_bilibili 1. 准备训练集 详细的数据集准备方法可参考视频,或者huggingFace 2. 分词(Tokenizer) …...
