前端知识--前端访问后端技术Ajax及框架Axios

news2024/9/23 13:15:55

一、异步数据请求技术----Ajax

Ajax是前端访问后端的技术,为异步请求(不刷新页面,请求数据,只更新局部数据)。

例如:在京东网站中搜索电脑,就会出现一些联想搜索,但此时页面并没有刷新。

 异步通信,常用的两种途径:

1)联想搜索

2)表单校验

 

步骤3中的onreadystatechange可以监听服务器端数据,数据来了,即可响应。 

二、Axios框架:用于替代Ajax

原生的Ajax因繁琐,已经不怎么用了,目前,使用Axios框架,可以简化Ajax操作。 

使用Axios操作,分为两步。其中发送请求分为get和post两种。

url是访问后台服务器的地址 ;

then的括号中填写的是函数,如上写的是箭头函数,(result)=>{}   result是函数参数,该参数为对象,用于接收后台传递过来的所有数据。该对象中含有多项数据,我们只需要data数据,故使用result.data

then为回调函数,当服务器访问成功,并响应了数据,就会触发此函数,服务端没影响,该函数是不执行的。 

示例:

使用post方式,需要再添加 data ,“id=1”是根据实际条件填写的。

上述get、post方式还可以如下简化,一般使用如下的方式 

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

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

相关文章

AI行业合适做必应bing推广吗?怎么开户呢?

快速发展的AI行业中,有效的市场获客渠道是关键,随着数字营销领域的不断演进,必应Bing以其独特的市场定位、庞大的用户基础和高效的广告系统,成为AI企业推广策略中的重要一环。特别是针对那些寻求精准触达、高效转化的AI企业而言&a…

2024国际燃气轮机运维周线上分享第一期开启!共探燃机新生态

为促进国内重型燃气轮机运维技术发展,加快建立独立自主的燃气轮机运维技术体系,2024国际燃气轮机运维大会将于2024年10月17-18日在中国广州盛大召开! 2024国际燃气轮机运维大会将通过线上直播会议、线下技术分享及颁奖典礼等形式展开&#xf…

血泪史!ora-00600 16305报错解决过程

一个客户重启操作系统后数据库启动不了,检查日志发现报错ORA-00600 [16305] 在MOS中找了一下,发现说是loopback地址不通: 测试了一下ping 127.0.0.1不通. 再次多次尝试发现登录到服务器上面,在本机上ping 127 localhost 本机实际地址 都不通,但是其它服务器可以ping通他的…

W30-python03-迭代器和生成器

迭代器:迭代是Python最强大的功能之一,是访问集合元素的一种方式。迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束。迭代器只能往前不会后退。 迭代器有两个基本的方法:iter() 和 next()。 生成器&#xff1…

Godot入门 05收集物品

创建新场景,添加Area2D节点,AnimatedSprite2D节点 ,CollisionShape2D节点 添加硬币 按F键居中,放大视图。设置动画速度设为10FPS,加载后自动播放,动画循环 碰撞形状设为圆形,修改Area2D节点为Co…

Java---后端文件上传详解

袁门才俊志高远, 震古烁今意决然。 风采翩翩才情显, 雄姿英发立世间。 目录 一,简单案例演示 二,服务器本地存储 三,配置单个文件上传大小限制 一,简单案例演示 首先简单编写一个前端网页: &l…

scrapy 爬取旅游景点相关数据(一)

第一节 Scrapy 练习爬取穷游旅游景点 配套视频可以前往B站:https://www.bilibili.com/video/BV1Vx4y147wQ/?vd_source4c338cd1b04806ba681778966b6fbd65 本项目为scrapy 练手项目,爬取的是穷游旅游景点列表数据 0 系统的环境 现在网上可以找到很多scr…

java基础概念05-运算符

一、自增自减运算符 二、赋值运算符 2-1、注意 三、关系运算符 四、逻辑运算符 4-1、短路逻辑运算符 五、三元运算符 六、运算符的优先级

PostgreSQL 中如何重置序列值:将自增 ID 设定为特定值开始

我是从excel中将数据导入,然后再通过sql插入数据,就报错。 需要设置自增ID开始值 1、确定序列名称: 首先,需要找到与的增字段相关的序列名称。假设表名是 my_table 和自增字段是 id,可以使用以下查询来获取序列名称…

嵌入式C++、Raspberry Pi、LoRa和Wi-Fi技术、TensorFlow、ROS/ROS2:农业巡检数据导航机器人设计流程(代码示例)

随着科技的不断进步,农业领域也在逐渐向智能化发展。农业巡检机器人作为农业智能化的重要组成部分,能够自动化地监测农作物生长状况,提高农业管理的效率和精确度。本文将介绍一个基于Raspberry Pi和NVIDIA Jetson的农业巡检机器人&#xff0c…

华天动力OA downloadWpsFile接口处任意文件读取漏洞复现 [附POC]

文章目录 华天动力OA downloadWpsFile接口处任意文件读取漏洞复现 [附POC]0x01 前言0x02 漏洞描述0x03 影响版本0x04 漏洞环境0x05 漏洞复现1.访问漏洞环境2.构造POC3.复现华天动力OA downloadWpsFile接口处任意文件读取漏洞复现 [附POC] 0x01 前言 免责声明:请勿利用文章内…

学习日记:输入输出

目录 1.概念 2. C语言函数库提供的输入输出函数 2.1 getchar 2.2 putchar 2.3 printf 附:占位符 2.4 scanf 3. 附加 1.概念 输入是从键盘、鼠标等设备向计算机(内存) 注:c语言本身不提供输入输出功能,使用的…

【北京迅为】《i.MX8MM嵌入式Linux开发指南》-第三篇 嵌入式Linux驱动开发篇-第四十章 Linux用户层和内核层

i.MX8MM处理器采用了先进的14LPCFinFET工艺,提供更快的速度和更高的电源效率;四核Cortex-A53,单核Cortex-M4,多达五个内核 ,主频高达1.8GHz,2G DDR4内存、8G EMMC存储。千兆工业级以太网、MIPI-DSI、USB HOST、WIFI/BT…

【React】组件:全面解析现代前端开发的基石

文章目录 一、什么是组件?二、组件的类型三、组件的生命周期四、状态管理五、属性传递六、组合与继承七、最佳实践 在现代前端开发中,React 已成为开发者构建用户界面的首选框架之一。React 的强大之处在于其组件化设计,允许开发者将 UI 拆分…

电量采集模块—应用于工厂车间配电室电网监测系统的搭建

前言 随着社会经济发展,工厂配电电网系统的供电实时监测越来越重要,这不仅是影响工厂安全性,更是工厂自动化的必然环节。工厂电力监测具有长时间在线工作的可靠性、较强的现场操作和与中心站的通讯功能,同时具有长时间记录存储数据…

04 标识符与关键字

1 标识符 标识符用于命名程序中标识像变量和函数这样的元素。 number1 eval(input("number: ")) number2 eval(input("number: ")) number3 eval(input("number: ")) average (number1 number2 number3) / 3 print("average: "…

【MySQL进阶之路 | 高级篇】行锁之临键锁和插入意向锁

1. 临键锁(Next-Key Locks) 有时候我们既想锁住某条记录,又想阻止其他事务在该记录前边的间隙插入新记录,所以InnoDB就提出了一种称之为Next-Key Locks的锁,官方的类型名称为:LOCK_ORDINARY,我们也可以简称…

Ubuntu20.04 设置静态ip

Ubuntu 从 17.10 开始,已放弃在 /etc/network/interfaces 里固定 IP 的配置,interfaces 文件不复存在,即使配置也不会生效,而是改成 netplan 方式 ,配置写在 /etc/netplan/01-netcfg.yaml ,50-cloud-init.y…

手把手教你使用 Python 制作超级玛丽游戏

编写一个完整的《超级玛丽兄弟》(Super Mario Bros.)风格的游戏需要涉及到多个方面,包括游戏循环、玩家控制、敌人AI、碰撞检测、关卡设计、得分系统等等。由于这是一个复杂的项目,我将为你提供一个更加详细的框架,并解…

Xstate inspect状态图的使用 和 原理

状态图的好处之一是,在将状态图组合在一起的过程中,您可以探索流程中所有可能的状态。这种探索将帮助您避免代码中的错误和错误,因为您更有可能涵盖所有可能发生的情况。 因为状态图是可执行的,所以它们既可以表现为图&#xff0…