ajax的完整写法——success/error/complete+then/catch/done+设置请求头两种方法——基础积累

news/2024/7/19 14:44:46 标签: ajax, 前端, js

ajax的完整写法——success/error/complete+then/catch/done+设置请求头两种方法——基础积累

  • 1.完整写法——success/error/complete
    • 1.1 GET/DELETE——query传参
    • 1.2 GET/DELETE——JSON对象传参
    • 1.3 PUT/POST——JSON对象传参
  • 2.简化写法——then/catch/done
    • 2.1 GET/DELETE——query传参
    • 2.2 PUT/POST——JSON对象传参

1.完整写法——success/error/complete

1.1 GET/DELETE——query传参

js">$.ajax({
	url: "/bigscreen/home/getDeptRiskInfoById",
	async: false,//是否异步,如果开启,则接口同步进行
	type: "GET",//大写的GET等同于小写的get
	data: {
		deptId: id,
	},
	headers: { "token": token },//设置请求头
	success: function (data) {
		//
	}
});

下面介绍设置请求头的第二种方法:

js">$.ajax({
    url: "/api/SchemeMain?id=" + row.id,
    type: "delete",
    beforeSend: (request) => {
        request.setRequestHeader("operator", encodeURIComponent(this.userName));
        request.setRequestHeader("operatorId", this.userId);
    },
    xhrFields: {
        withCredentials: true
    },
    success: res => {
        if (res.success) {
            this.$message.success('删除成功');
        } else {
            this.$message.error(res.message);
        }
    },
    complete: () => {}
})

1.2 GET/DELETE——JSON对象传参

js">$.ajax({
     type: "get",
     url: '/ReportForm/ReportForm/ReceiptDataExport',
     contentType: 'application/json',
     dataType: 'json',
     async: false,
     data: { start: this.input.StartTime, end: this.input.EndTime },
     success: function (data) {
         if (data.Status) {
            //
         }
     },
     error: function (xhr) {
         console.log(xhr.responseText);
     }
 });

1.3 PUT/POST——JSON对象传参

下面代码用到了layui中的部分代码,可忽略。

js">$.ajax({
  type: "PUT",//PUT一般是修改数据,POST一般是添加数据
  url: url,
  data: JSON.stringify(obj), //格式化数据
  contentType: "application/json", //指定格式为json,对应postman中的raw
  dataType: "json",//这个也是
  success: function (res) {
      console.log(res);
      if (res.success) {
          layer.msg('修改成功');
          parent.layer.close(1);
          window.parent.location.reload();
      } else {
          layer.msg(res.message)
      }
  },
  complete: function () {
      var index = parent.layer.getFrameIndex(window.name); //关闭弹层
      parent.layer.close(index);
  }
});

2.简化写法——then/catch/done

2.1 GET/DELETE——query传参

js">$.get("/ReportForm/ReportForm/PeopleOutSku?StartTime=" + startTime + "&EndTime=" + endTime).then(res => {
    this.dataLoading = false;
    if (res.Status) {
        this.buttominfo = res.Data;
    }
})

2.2 PUT/POST——JSON对象传参

js">$.post("CreateMixOnShelfMap", { input: ids, createType: val }).then(function (data) {
        this.mixLoading = false;
        if (data.Success) {
            that.$message({
                message: "已经为选中的物料分配好对应的库位,请使用PDA上架操作.",
                type: "success"
            });
        } else {
            that.$message({
                message: data.Message,
                type: "warning"
            });
            that.mixin.visible = false;
        }
        that.allLoading = false;
        that.partLoading = false;
        that.getMixinList();
    });
}).catch(() => {
    this.$message({
        type: 'info',
        message: '操作已取消'
    });
    this.allLoading = false;
    this.partLoading = false;
    this.getMixinList();
}).done(()=>{
	//
});

http://www.niftyadmin.cn/n/5291819.html

相关文章

API集群负载统计 (100%用例)C卷 (JavaPythonNode.jsC语言C++)

某个产品的RESTful API集合部署在服务器集群的多个节点上, 近期对客户端访问日志进行了采集,需要统计各个API的访问频次, 根据热点信息在服务器节点之间做负载均衡,现在需要实现热点信息统计查询功能。 RESTful API的由多个层级构成,层级之间使用/连接,如/A/B/C/D这个地址…

RK3399平台入门到精通系列讲解(导读篇)21天挑战Linux系统开发

🚀返回总目录 文章目录 一、关于作者1、博主的联系方式2、支持二、需要具备的知识和工具1、需掌握知识点2、需了解的知识点三、通过系列博客可以学到什么1、本系列博文特色2、21天学习目标3、21天学习内容4、学习时间5、学习产出

抖音、小红书、视频号是如何判定是否限流的?

在这个新媒体营销的时代,抖音、小红书和视频号作为中国最受欢迎的社交媒体平台,为品牌和内容创作者提供了极具潜力的展示空间。然而,无论在哪个平台,限流成为很多人的苦恼。 抖音的推荐算法基于人群画像和初始流量池,同…

自动化网络故障修复管理

什么是故障管理 故障管理是网络管理的组成部分,涉及检测、隔离和解决问题。如果实施得当,网络故障管理可以使连接、应用程序和服务保持在最佳水平,提供容错能力并最大限度地减少停机时间。专门为此目的设计的平台或工具称为故障管理系统。 …

Hive讲课笔记:内部表与外部表

文章目录 一、导言二、内部表1.1 什么是内部表1.1.1 内部表的定义1.1.2 内部表的关键特性 1.2 创建与操作内部表1.2.1 创建并查看数据库1.2.2 在park数据库里创建student表1.2.3 在student表插入一条记录1.2.4 通过HDFS WebUI查看数据库与表 三、外部表2.1 什么是外部表2.2 创建…

最长的指定瑕疵度的元音子串 (100%用例)C卷 (JavaPythonNode.jsC语言C++)

开头和结尾都是元音字母(aeiouAEIOU)的字符串为 元音字符串 ,其中混杂的非元音字母数量为其 瑕疵度 。比如 : “ a ” 、 “ aa ”是元音字符串,其瑕疵度都为 0 “ aiur ”不是元音字符串(结尾不是元音字符) “ abira ”是元音字符串,其瑕…

OpenCV-Python(29):图像特征

目录 目标 背景介绍 常用特征 应用场景 目标 理解什么是图像特征 为什么图像特征很重要 为什么角点很重要 背景介绍 相信大多数人都玩过拼图游戏吧。首先你们拿到一张图片的一堆碎片,你要做的就是把这些碎片以正确的方式排列起来从而重建这幅图像。问题是&…

Vulnhub-Al-Web-1.0 靶机复现完整过程

一、信息收集 1.主机发现 arp-scan -l2.端口扫描 nmap -sV -p- 192.168.200.16PORTSTATESERVICEVERSIONMAC Address80/TCPOpenhttpApache httpd00:0C:29:C4:1B:78 (VMware) 3.目录扫描 python dirsearch.py -u http://192.168.200.16扫描出来这两个文件,首先先…