当前位置： 首页 > news >正文

Axios的使用简单说明

news 2026/2/8 16:22:27

axios 请求方式和参数

axios 可以发送 ajax 请求，不同的方法可以发送不同的请求:
  1. axios.get：发送get请求
  2. axios.post：发送post请求
  3. axios.put：发送put请求
  4. axios.delete：发送delete请求
无论哪种方法，第一个参数为请求的后端接口
因为 post 和 put 请求方式，参数会放到请求体中，而 get 和 delete 请求方式，参数会放在 url 中
所以
        1.post 和 put 请求时，第二个参数是一个对象，存储要发送给后端的数据
        2.get 和 put 请求时：可以自己通过问号传值，也可以将参数对象包裹起来，放在第二个参数

 axios 返回值（响应结构）

axios 会创建一个对象，里面有很多属性， axios 会将服务端返回的数据放到一个叫做 data 的属性中

补充:axios改造ajax的回调函数

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function ajax(type, url) {
const p = new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest()
xhr.open(type, url)
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
data = JSON.parse(xhr.responseText)
// 根据实际情况进行处理
resolve(data)
}
}
xhr.send()
})
return p
}
function f1() {
ajax('get', 'http://127.0.0.1:8000/app/f1/').then(data => {
console.log(data);
})
}
function f2() {
ajax('get', 'http://127.0.0.1:8000/app/f2/').then(data => {
console.log(data);
})
}
f1()
f2()
</script>
</body>
</html>

相关文章：

Axios的使用简单说明

axios 请求方式和参数 axios 可以发送 ajax 请求&#xff0c;不同的方法可以发送不同的请求: axios.get&#xff1a;发送get请求 axios.post&#xff1a;发送post请求 axios.put&#xff1a;发送put请求 axios.delete&#xff1a;发送delete请求 无论哪种方法&#xff0c;第一…...

编程日记 2024/5/29 17:49:42

查找list集合中，持续时间＞=ContinueTime的数据集合，保存在新的list中

在给定的包含时间戳的list中&#xff0c;查找连续continueNum次的且时间间隔为needDiff的集合。 eg&#xff1a;相邻两个数据的时间戳间隔为1分钟&#xff0c;且超过30分钟有数据 /**** param list 包含时间戳&#xff08;10位&#xff09;的list* param continueNum 至少持续…...

编程日记 2024/5/29 17:47:40

nginx 反向代理配置详解

Nginx 反向代理是一种常用的部署策略&#xff0c;用于将客户端请求转发到内部网络中的一个或多个服务器&#xff0c;这些服务器直接处理请求并返回响应给Nginx&#xff0c;再由Nginx转交给客户端。这种设置可以提高网站的可用性和安全性&#xff0c;同时也能实现负载均衡、缓存…...

编程日记 2024/5/29 17:46:38

微信小程序毕业设计-农场驿站平台系统项目开发实战(附源码+论文)

大家好&#xff01;我是程序猿老A&#xff0c;感谢您阅读本文&#xff0c;欢迎一键三连哦。 &#x1f49e;当前专栏&#xff1a;微信小程序毕业设计 精彩专栏推荐&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; &#x1f380; Python毕业设计…...

编程日记 2024/5/29 17:44:36

CAN总线应用协议CANopen

作为一种真正开放的CAN总线高层协议&#xff0c;CANopen协议允许不同的CAN设备以标准化的方式进行通讯&#xff0c;这使得CAN 设备具有互操作性。随着CANopen协议的日益完善&#xff0c;它已经广泛应用于多个行业。本文将对CANopen协议的对象字典、通讯对象、网络管理等几个方面…...

编程日记 2024/5/29 17:43:35

htop安装不了怎么解决

&#x1f31f;&#x1f30c; 欢迎来到知识与创意的殿堂 — 远见阁小民的世界&#xff01;&#x1f680; &#x1f31f;&#x1f9ed; 在这里&#xff0c;我们一起探索技术的奥秘&#xff0c;一起在知识的海洋中遨游。 &#x1f31f;&#x1f9ed; 在这里&#xff0c;每个错误都…...

编程日记 2024/5/29 17:42:33

vue 笔记02

目录 01 事件修饰符 02 按键修饰符 03 v-bind属性 04 vue-axios的基本使用 05 vue的生命周期 06 vue生命周期涉及到的其他的知识点 01 事件修饰符 vue的事件修饰符 事件名称.修饰符1.修饰符2...事件驱动函数 stop 阻止冒泡修饰符 prevent 阻止默认行为 once 当前事件只触…...

编程日记 2024/5/29 17:40:31

MySQL8.0免安装及phpmyadmin配置

安装包解压&#xff0c;运行mysqld文件后&#xff0c;启动net start&#xff0c;提示成功&#xff0c;但进入phpmyadmin登录页面后&#xff0c;输入用户名&#xff0c;提示不支持空密码&#xff0c;config.default.php设置密码后&#xff0c;提示 mysqli::real_connect(): (HY…...

编程日记 2024/5/29 17:38:28

【目标解算】相机内外参数详细解读+坐标系转换

一、相机参数介绍 1.1 相机内参矩阵 概念&#xff1a;内参矩阵用于描述相机的内部参数&#xff0c;它包含了相机的焦距、主点坐标和图像的畸变等信息。内参矩阵的形式通常为一个3x3的矩阵&#xff0c;常用表示为K。内参矩阵可以将相机坐标系中的三维点映射到图像平面上的二维…...

编程日记 2024/5/29 17:37:26

【Unity】颜色混合计算

在图形渲染中&#xff0c;颜色混合&#xff08;Color Blending&#xff09;是指将多个颜色值组合在一起以生成最终显示的颜色。颜色混合技术广泛用于处理半透明效果、光照效果和后期处理效果。以下是一些常见的颜色混合模式&#xff1a; 1. 正常混合&#xff08;Normal Blendi…...

编程日记 2024/5/29 17:36:25

Vue源码解析

入门级 <body><div id"app"></div><script>class Vue {constructor(options) {// thisVue 把options.created的this 指向Vue实例options.created.bind(this)();// this.$el 指向#appthis.$el document.querySelector(options.el);// 把opt…...

编程日记 2024/5/29 17:35:24

Linux---网络相关配置

文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 前言 一台主机需要配置必要的网络信息&#xff0c;才可以连接到互联网&#xff0c;需要的配置网络信息包括IP&#xff0c;子网掩码&#xff0c;网关和DNS。 一.查看网络信息 查看IP信息可以通…...

编程日记 2024/5/29 17:34:22

MATLAB分类与判别模型算法：基于Fisher算法的分类程序【含Matlab源码 MX_002期】

算法思路介绍&#xff1a; 费舍尔线性判别分析&#xff08;Fishers Linear Discriminant Analysis&#xff0c;简称 LDA&#xff09;&#xff0c;用于将两个类别的数据点进行二分类。以下是代码的整体思路&#xff1a; 生成数据&#xff1a; 使用 randn 函数生成随机数&#x…...

编程日记 2024/5/29 17:33:21

长文总结 | Python基础知识点，建议收藏

测试基础-Python篇 基础① 变量名命名规则 - 遵循PEP8原则 普通变量&#xff1a;max_value 全局变量&#xff1a;MAX_VALUE 内部变量&#xff1a;_local_var 和关键字重名&#xff1a;class_ 函数名&#xff1a;bar_function 类名&#xff1a;FooClass 布尔类型的变量名…...

编程日记 2024/5/29 17:32:20

centos中使用Docker安装rabbitmq记录

一、安装rabbitmq docker run -d --name rabbitmq -p 5672:5672 -p15672:15672 -v rabbitmq-plugin:/plugins -e RABBITMQ_DEFAULT_USERxiaoqi -eRABBITMQ_DEFAULT_PASS123456 rabbitmq:latest二、配置web管理界面 # 查看运行的容器 docker ps -a # 根据容器id进入容器内部 …...

编程日记 2024/5/29 17:31:19

STM32系列-STM32介绍

&#x1f308;个人主页&#xff1a;羽晨同学 &#x1f4ab;个人格言:“成为自己未来的主人~” STM32介绍 STM32介绍 ST&#xff1a;指的是意法半导体 M&#xff1a;指定微处理器 32&#xff1a;表示计算机处理器位数 ARM分成三个系列&#xff1a; Cortex-A&#xff1…...

编程日记 2024/5/29 17:30:18

网络原理 一

一、协议 网络通信中,协议是非常重要的概念. 协议进行了分层,此处就是按照这几层顺序来介绍每一层中的核心协议. 应用层,就对应着应用程序,是程序员打交道最多的一层,调用系统提供的 网络api 写出的代码都是基于应用层的. 应用层这里当然也有很多现成的协议,但更多的还是,程…...

编程日记 2024/5/29 17:28:16

xcode配置快速打开终端命令行工具教程

以往我们使用idea编辑器或者vscode编辑器的时候&#xff0c;我们可以快速的在编辑器下面打开终端进行相关的操作&#xff0c;但是在xcode里面却没有这么方便的功能按钮&#xff0c;真的不是很习惯&#xff0c;所以这次就来给xcode配置这么一个方便的功能。 idea的Terminal 这…...

编程日记 2024/5/29 17:25:12

AIGC降重：如何2分钟降低论文AI率和查重率？推荐使用SpeedAI科研小助手

确保学术论文的独立性与诚信性&#xff0c;对于学业的成就及学位的获取至关重要&#xff0c;其中&#xff0c;论文的人工智能查重与降低AIGC相似度扮演着核心角色。 常规的查重手段主要围绕查重软件的运用和个体的自行审查&#xff1b;而降重则通常通过语句重组、同义替换、内…...

编程日记 2024/5/29 17:22:09

Blazor入门-连接MySQL的简单例子：列出数据+简单查询

参考&#xff1a; ASP.NET Core 6.0 Blazor Server APP并使用MySQL数据库_blazor mysql-CSDN博客 https://blog.csdn.net/mzl87/article/details/129199352 本地环境&#xff1a;win10, visual studio 2022 community, mysql 8.0.33 (MySQL Community Server), net core 6.0 目…...

编程日记 2024/5/29 17:21:06

观成科技：隐蔽隧道工具Ligolo-ng加密流量分析

1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具&#xff0c;该工具基于TUN接口实现其功能&#xff0c;利用反向TCP/TLS连接建立一条隐蔽的通信信道&#xff0c;支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式&#xff0c;适应复杂网…...

编程新知 2026/2/8 4:37:24

2021-03-15 iview一些问题

1.iview 在使用tree组件时&#xff0c;发现没有set类的方法&#xff0c;只有get&#xff0c;那么要改变tree值&#xff0c;只能遍历treeData&#xff0c;递归修改treeData的checked&#xff0c;发现无法更改&#xff0c;原因在于check模式下&#xff0c;子元素的勾选状态跟父节…...

编程新知 2026/2/5 3:29:13

SpringBoot+uniapp 的 Champion 俱乐部微信小程序设计与实现，论文初版实现

摘要 本论文旨在设计并实现基于 SpringBoot 和 uniapp 的 Champion 俱乐部微信小程序&#xff0c;以满足俱乐部线上活动推广、会员管理、社交互动等需求。通过 SpringBoot 搭建后端服务&#xff0c;提供稳定高效的数据处理与业务逻辑支持&#xff1b;利用 uniapp 实现跨平台前…...

编程新知 2026/1/31 10:55:22

C# 类和继承(抽象类)

抽象类 抽象类是指设计为被继承的类。抽象类只能被用作其他类的基类。 不能创建抽象类的实例。抽象类使用abstract修饰符声明。 抽象类可以包含抽象成员或普通的非抽象成员。抽象类的成员可以是抽象成员和普通带 实现的成员的任意组合。抽象类自己可以派生自另一个抽象类。例…...

编程新知 2026/1/29 16:25:24

WEB3全栈开发——面试专业技能点P2智能合约开发（Solidity）

一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解&#xff0c;适合用作学习或写简历项目背景说明。 &#x1f9e0; 一、概念简介&#xff1a;Solidity 合约开发 Solidity 是一种专门为 以太坊&#xff08;Ethereum&#xff09;平台编写智能合约的高级编…...

编程新知 2026/1/27 9:33:09

OPenCV CUDA模块图像处理-----对图像执行 均值漂移滤波（Mean Shift Filtering）函数meanShiftFiltering()

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 在 GPU 上对图像执行 均值漂移滤波&#xff08;Mean Shift Filtering&#xff09;&#xff0c;用于图像分割或平滑处理。 该函数将输入图像中的…...

编程新知 2026/1/20 12:53:30

Linux C语言网络编程详细入门教程：如何一步步实现TCP服务端与客户端通信

文章目录 Linux C语言网络编程详细入门教程&#xff1a;如何一步步实现TCP服务端与客户端通信前言一、网络通信基础概念二、服务端与客户端的完整流程图解三、每一步的详细讲解和代码示例1. 创建Socket&#xff08;服务端和客户端都要&#xff09;2. 绑定本地地址和端口&#x…...

编程新知 2025/10/31 21:54:15

中医有效性探讨

文章目录 西医是如何发展到以生物化学为药理基础的现代医学&#xff1f;传统医学奠基期&#xff08;远古 - 17 世纪&#xff09;近代医学转型期&#xff08;17 世纪 - 19 世纪末&#xff09;​现代医学成熟期&#xff08;20世纪至今&#xff09; 中医的源远流长和一脉相承远古至…...

编程新知 2026/1/23 7:56:54

作为测试我们应该关注redis哪些方面

1、功能测试 数据结构操作&#xff1a;验证字符串、列表、哈希、集合和有序的基本操作是否正确 持久化&#xff1a;测试aof和aof持久化机制&#xff0c;确保数据在开启后正确恢复。 事务&#xff1a;检查事务的原子性和回滚机制。 发布订阅&#xff1a;确保消息正确传递。 2、性…...

编程新知 2025/11/1 2:00:51

pikachu靶场通关笔记19 SQL注入02-字符型注入(GET)

目录 一、SQL注入 二、字符型SQL注入 三、字符型注入与数字型注入 四、源码分析 五、渗透实战 1、渗透准备 2、SQL注入探测 &#xff08;1&#xff09;输入单引号 &#xff08;2&#xff09;万能注入语句 3、获取回显列orderby 4、获取数据库名database 5、获取表名…...

编程新知 2026/2/5 5:47:53