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

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

1.1 GET/DELETE——query传参

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

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

$.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对象传参

$.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中的部分代码，可忽略。

$.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传参

$.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对象传参

$.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(()=>{
	//
});