vue2【axios请求】

1:axios作用

axios(发音:艾克c奥斯)是前端圈最火的,专注于数据请求的库。

Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中axios的github:https://github.com/axios/axios

中文官网地址:http://www.axios-js.com/

英文官网地址:https://www.npmjs.com/package/axios

1.1:引入axios

首先就是引入axios,如果你使用es6,只需要安装axios模块之后

当然也可以用script引入

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

2:axios的基础语法

2.1:发起get请求示例

get请求传参的两种方式

第一种拼接路径上面,第二种将参数写在params内

//通过给定的ID来发送请求
axios.get('/user?ID=12345').then(function(response){console.log(response);}).catch(function(err){console.log(err);
});
//以上请求也可以通过这种方式来发送
axios.get('/user',{params:{ID:12345}}).then(function(response){console.log(response);}).catch(function(err){console.log(err);
});

2.2:发起post请求示例

post请求的示例:

axios.post('/user',{firstName:'Fred',lastName:'Flintstone'}).then(function(res){console.log(res);}).catch(function(err){console.log(err);
});

3:为什么使用async和await

调用axios方法得到的返回值是Promise对象

注意:如果调用某个方法的返回值是Promise实例,则前面可以添加await!

因为await只能用在被async"修饰"方法中,所有使用await需要带async,成对出现

示例:

3.1:结构响应的属性

通过{对象里面的属性名} 解构出想要的属性 

3.2:对结构的属性重命名

通过:的方式对属性进行重命名

4:基于axios.get()和axios.post()发送请求

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Spring 国际化:i18n 如何使用

1、i18n概述 国际化也称作i18n&#xff0c;其来源是英文单词 internationalization的首末字符i和n&#xff0c;18为中间的字符数。由于软件发行可能面向多个国家&#xff0c;对于不同国家的用户&#xff0c;软件显示不同语言的过程就是国际化。通常来讲&#xff0c;软件中的国…

为什么Transformer模型中使用Layer Normalization(Layer Norm)而不是Batch Normalization(BN)

❤️觉得内容不错的话&#xff0c;欢迎点赞收藏加关注&#x1f60a;&#x1f60a;&#x1f60a;&#xff0c;后续会继续输入更多优质内容❤️ &#x1f449;有问题欢迎大家加关注私戳或者评论&#xff08;包括但不限于NLP算法相关&#xff0c;linux学习相关&#xff0c;读研读博…

anaconda安装依赖报错ERROR: Cannot unpack file C:\Users\33659\AppData\Loca...|问题记录

执行命令&#xff1a; # 安装matplotlib依赖 pip install matplotlib-i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com出现问题&#xff1a; ERROR: Cannot unpack file C:\Users\33659\AppData\Local\Temp\pip-unpack-0au_blfq\simple (downloa…

【入门篇】1.4 redis 客户端 之 Lettuce 详解

文章目录 1. 简介1. 什么是Lettuce2. Lettuce与其他Redis客户端的比较3. Lettuce的特性和优势 2. 安装和配置3. 连接池配置1. 什么是连接池2. Lettuce的连接池使用与配置3. 连接池配置项 4. 基本操作1. 如何创建Lettuce连接2. Lettuce的基本操作如增删改查3. Lettuce的事务操作…

JavaScript管理HTMLDOM元素(增删改查)

本文主要讲解JavaScript如何通过管理HTML上的DOM元素&#xff0c;其中包括如何查询、创建、修改以及删除具体功能和源码讲解。 增加 首先我们准备一个HTML框架和简单CSS样式&#xff0c;我对其中元素作用和关系进行一个简单说明。 <!DOCTYPE html> <html><he…

【Qt开发流程】之HelloWorld程序

【Qt开发流程】之HelloWorld程序 目的编写程序新建项目文件说明及界面设计 程序运行及发布程序运行程序发布手动构建使用windeployqt进行构建 设置应用程序图标修改快捷键类型列表命令行编译程序命令行编译.ui文件自定义类项目模式及项目文件介绍项目模式项目文件 目的 从Hell…

【LeetCode刷题日志】225.用队列实现栈

&#x1f388;个人主页&#xff1a;库库的里昂 &#x1f390;C/C领域新星创作者 &#x1f389;欢迎 &#x1f44d;点赞✍评论⭐收藏✨收录专栏&#xff1a;LeetCode 刷题日志&#x1f91d;希望作者的文章能对你有所帮助&#xff0c;有不足的地方请在评论区留言指正&#xff0c;…

青少年CTF-WEB-Flag在哪里?

题目环境&#xff1a;F12查看源代码得到flag&#xff1a;qsnctf{1167716c-54f0-47da-baed-49e3b08dfaeb} 此题主要考察F12查看源代码的使用

趣学python编程 (二、计算机硬件和用途介绍)

1944年&#xff0c;美籍匈牙利数学家 冯诺依曼 提出计算机基本结构和工作方式的设想&#xff0c;为计算机的诞生和发展提供了理论基础。时至今日&#xff0c;尽管计算机软硬件技术飞速发展&#xff0c;但计算机本身的体系结构并没有明显的突破&#xff0c;当今的计算机仍属于冯…

Spring Framework 6.1 正式 GA

Spring Framework 6.1在运行时方面针对 JDK 21 和 Jakarta EE 10 上提供了一级支持&#xff0c;同时保留了 JDK 17 和 Jakarta EE 9 基线。Spring 还通过精细的元数据推理跟踪 GraalVM for JDK 21 的演变&#xff0c;同时暂时保持与 GraalVM 22.3 的兼容性。 主要变化 支持 JD…

PHP排序sort()、asort() 和 ksort() 的区别及用法

&#x1f3c6;作者简介&#xff0c;黑夜开发者&#xff0c;CSDN领军人物&#xff0c;全栈领域优质创作者✌&#xff0c;CSDN博客专家&#xff0c;阿里云社区专家博主&#xff0c;2023年6月CSDN上海赛道top4。 &#x1f3c6;数年电商行业从业经验&#xff0c;历任核心研发工程师…

十. Linux关机重启命令与Vim编辑的使用

关机重启命令 shutdown命令 其他关机命令 其他重启命令 系统运行级别 系统默认运行级别与查询 退出登录命令logout 文本编辑器Vim Vim简介 没有菜单,只有命令Vim工作模式 Vim常用命令 插入命令 定位命令 删除命令 复制和剪切命令 替换和取消命令 搜索和搜索替换命令 保存和退出…