Ajax快速入门

文章目录

  • Ajax
    • 原生ajax
    • axios
    • 案例

Ajax

Ajax就是前端访问服务器端数据的一个技术
还有主要就是异步交互
就是在不刷新整页面的情况下,和服务器交换部分我也数据
比如搜索的联想技术
在这里插入图片描述
同步和异步的概念
一个是客户端需要等待服务器完成处理,才能进行别的事
一个是客户端不需要等待服务器处理完也可以进行别的事
在这里插入图片描述

原生ajax

就发送请求,然后判断条件如果响应成功
就赋值再进行对应的逻辑处理(我们这里是直接展示出来)
在这里插入图片描述
在这里插入图片描述

axios

axios就是简化了原生ajax请求步骤
第一个是以get方式发送请求
第二个是post方式发送请求,还有传一个参数指定删除员工的id
hen(result),result是我们接收服务器返回结果的对象
在这里插入图片描述
还是通过表单标签来调用定义的方法
在这里插入图片描述

但是这样稍微有点麻烦
axios提供了别名
在这里插入图片描述
简化后

在这里插入图片描述

案例

在这里插入图片描述
基本格式代码
在这里插入图片描述
vue的代码
注意:合用之前的知识
当挂载完成的时候,用axios异步请求emp参数,然后再赋值给我们vue的data也就是数据层
然后vue就拿到对应服务端的数据
实现了动态数据

然后我再更改一下对应的url,使其不是固定的而是emp中获取的
由于要全部展现还要用到之前的指令
v-for
还要判断1和2来展示男女,还要用到v-if
在这里插入图片描述

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

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

相关文章

力扣 | 清空注释

c 注释有两种,一种是 // 另一种是 /**/ 简单理解就是把所有的注释内容清空,然后只保留未注释内容 思路(模拟):因为代码是一行一行的记录下来的,遍历每一行代码。有两种情况,第一种,如…

【音视频】edge与chrome在性能上的比较

目录 结论先说 实验 结论 实验机器的cpu配置 用EDGE拉九路​编辑 google拉五路就拉不出来了 资源使用情况 edge报错​编辑 结论先说 实验 用chrome先拉九路,再想用edge拉九路,发现拉五路后怎么也拉不出; 后面发现cpu爆满;切…

实证研究在机器学习中的应用

实证研究是一种基于实际数据和事实的科学研究方法,目的是通过观察、测量、分析和解释数据来验证或否定某个假设、理论或研究问题。这种研究方法通常用于社会科学、自然科学和医学等领域。以下是实证研究的详细解释: 研究目标:实证研究旨在通过…

C++---list常用接口和模拟实现

list---模拟实现 list的简介list函数的使用构造函数迭代器的使用list的capacitylist element accesslist modifiers list的模拟实现构造函数,拷贝构造函数和迭代器begin和endinsert和eraseclear和析构函数 源码 list的简介 list是用双向带头联表实现的一个容器&…

【flowable介绍】

这里写目录标题 1.flowable官⽅⽂档2.flowable相关表说明3.操作名词解释 1.flowable官⽅⽂档 flowable官⽅⽂档:https://flowable.com/open-source/docs/bpmn/ch02-GettingStarted/ 基于6.5中⽂翻译⽂档:https://l1yp.com/docs/flowable/bpmn/#bpmnGate…

【cf】CodeForces Round 890(Div.2)题解 A - C

A. Tales of a Sort 题意 给出一个数组,每次操作可以将 所有 元素 a [ i ] a[i] a[i] 变成 m a x ( 0 , a i − i ) max(0,a_i-i) max(0,ai​−i),问至少操作多少次能将数组变成递增数组 思路 这一题卡很久,最后发现踩了两个坑 题目读…

前端笔记html-layer使用

layer.open方法 layer.open({type:2, //可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)title: title,content:[…

Python-flask项目入门

一、flask对于简单搭建一个基于python语言-的web项目非常简单 二、项目目录 示例代码 git路径 三、代码介绍 1、安装pip依赖 通过pip插入数据驱动依赖pip install flask-sqlalchemy 和 pip install pymysql 2.配置数据源 config.py DIALECT mysql DRIVER pymysql USERN…

Spring(11) Bean的生命周期

目录 一、简介二、Bean的流程1.BeanDefinition2.Bean 的生命周期 三、代码验证1.User 实体类2.MyBeanPostProcessor 后置处理器3.SpringConfig 扫描包配置4.UserTest 测试类5.测试结果6.模拟AOP增强 一、简介 首先,为什么要学习 Spring 中 Bean 的生命周期呢&#…

反弹shell的N种姿势

预备知识1. 关于反弹shell 就是控制端监听在某TCP/UDP端口,被控端发起请求到该端口,并将其命令行的输入输出转到控制端。reverse shell与telnet,ssh等标准shell对应,本质上是网络概念的客户端与服务端的角色反转。2. 反弹shel…

webpack性能优化

文章目录 1. 性能优化-分包2. 动态导入3. 自定义分包4. Prefetch和Preload5. CDN加载配置6. CSS的提取7. terser压缩7.1 Terser在webpack中配置7.2 css压缩 8. Tree Shaking 消除未使用的代码8.1 usedExports 配置8.2 sideEffects配置8.3 CSS实现Tree Shaking 9. Scope Hoistin…

k8s概念-污点与容忍

k8s 集群中可能管理着非常庞大的服务器,这些服务器可能是各种各样不同类型的,比如机房、地理位置、配置等,有些是计算型节点,有些是存储型节点,此时我们希望能更好的将 pod 调度到与之需求更匹配的节点上。 此时就需要…

人工智能在心电信号分类中的应用

目录 1 引言 2 传统机器学习中的特征提取与选择 3 深度学习中的特征提取与选择

ROS2学习(五)进程内topic高效通信

对ROS2有一定了解后,我们会发现ROS2中节点和ROS1中节点的概率有很大的区别。在ROS1中节点是最小的进程单元。在ROS2中节点与进程和线程的概念完全区分开了。具体区别可以参考 ROS2学习(四)进程,线程与节点的关系。 在ROS2中同一个进程中可能存在多个节点…

并查集练习 — 扩展问题(二)

根据并查集练习 —岛屿数量的问题再次扩展: 原题是给定一个二维数组matrix(char[][]),里面的值不是1就是0,上、下、左、右相邻的1认为是一片岛。返回matrix中岛的数量。 扩展为:如果是中国的地图&#xff0…

Xposed回发android.os.NetworkOnMainThreadException修复

最近用xposed进行hook回发的时候,又出现了新的问题; android.os.NetworkOnMainThreadException; 在Android4.0以后,写在主线程(就是Activity)中的HTTP请求,运行时都会报错,这是因为…

移动开发最佳实践:为 Android 和 iOS 构建成功应用的策略

您可以将本文作为指南,确保您的应用程序符合可行的最重要标准。请注意,这份清单远非详尽无遗;您可以加以利用,并添加一些自己的见解。 了解您的目标受众 要制作一个成功的应用程序,你需要了解你是为谁制作的。从创建…

API接口:企业信息核验

企业信息核验是现代企业管理中必不可少的一项业务,它可以帮助企业做出正确的决策。在这篇文章里,我们将会介绍如何使用API接口来对企业信息进行核验,并实现快捷、准确的查询。 一、API接口 在这里我们使用的是挖数据提供的企业信息核验API接…

SQL-方法论

写SQL时可以考虑的手段: 行转列 先分为多个临时表,然后JOIN到一起 select uid,t1.name YuWen,t2.name ShuXue from (select uid,namefrom tableAwhere naem 语文) t1join (select uid,namefrom tableAwhere naem 数学) t2on t1.uid t2.uid; 用sum(if…

数据结构 10-排序6 Sort with Swap(0, i)(C语言)

10-排序6 Sort with Swap(0, i) Given any permutation of the numbers {0, 1, 2,..., N−1}, it is easy to sort them in increasing order. But what if Swap(0, *) is the ONLY operation that is allowed to use? For example, to sort {4, 0, 2, 1, 3} we may apply the…