使用Promise封装Ajax()

骑猪看日落 2023-10-08 11:14 22阅读 0赞

## 封装Ajax ##

let _ajax = ({
        method, url, data}) => {
        
        return new Promise((resolve, reject) => {
        
            $.ajax({
        
                type: method,
                url: url,
                data: data,
                dataType: "json",
                success:function (res) {
        
                    resolve(res);
                },
                error:function (err) {
        
                    reject(err)
                }
            })
        });
    }

## 调用封装好的方法 ##

_ajax("GET","http:localhost:8080/category/list.do",null)
        .then(res => {
        
            // 成功返回
            console.log(res);
        }).catch(err=>{
        
            // 异常返回
            console.error(err);
    })

## 说明 ##

*  不太了解Promise用法请查看：[https://blog.csdn.net/github\_38336924/article/details/100583478][https_blog.csdn.net_github_38336924_article_details_100583478]
 *  Promise 写法的固定套路
    
        return new Promise((resolve, reject) => {
              
               // 要做的事情
        });
 *  上面代码遵循ES6，`function(){}` 换成了 箭头函数`() =>{}`,优点如下：

1.  箭头函数不会创建this，避免this指向问题
2.  代码更简洁

[https_blog.csdn.net_github_38336924_article_details_100583478]: https://blog.csdn.net/github_38336924/article/details/100583478

发表评论取消回复

表情：

评论列表（有 0 条评论，22人围观）

还没有评论，来说两句吧...

相关阅读

相关使用Promise封装Ajax()

封装Ajax let _ajax = ({ method, url, data}) => { return ne

骑猪看日落/ 2023年10月08日 11:14/ 0 赞/ 23 阅读

相关 Promise_03封装 AJAX

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

向右看齐/ 2023年10月06日 17:26/ 0 赞/ 58 阅读

相关 Promise实战AJAX封装

一、利用Promise的知识，对最开始的ajax的例子进行一个简单的封装： var url = 'xxx'; // 封装一个get请求的方法 function req

灰太狼/ 2023年06月11日 10:23/ 0 赞/ 17 阅读

相关 promise封装XMLHttpRequest请求，封装ajax

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></t

清疚/ 2023年01月16日 14:21/ 0 赞/ 185 阅读

相关使用Promise封装Ajax操作

请使用Promise封装Ajax操作原始的Ajax操作如下：原型： var onSuccess = function(result){ }; //成功的回调

朴灿烈づ我的快乐病毒、/ 2022年12月21日 02:28/ 0 赞/ 221 阅读

相关 Promise封装ajax

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

我不是女神ヾ/ 2022年10月11日 00:46/ 0 赞/ 262 阅读

相关 Ajax 搭配 Promise 封装

简述 Ajax（Asynchronous JavaScript And XML） Promise JavaScript

客官°小女子只卖身不卖艺/ 2022年05月25日 02:26/ 0 赞/ 270 阅读

相关使用Promise、axios封装ajax异步请求

先上代码（加载动画用的是Element UI组件） import axios from "axios" import Vue from 'vue' i

た入场券/ 2022年04月11日 02:40/ 0 赞/ 530 阅读

相关利用promise封装ajax

1.网上很多封装，但是自己觉得为什么要分开封装呢？get和post封装成一个函数不好么？根据自己以前封装的ajax顺手改了一下，并在自己的项目中使用了一下，还可以。

蔚落/ 2022年01月19日 06:03/ 0 赞/ 295 阅读

相关 promise封装ajax

关于promise使用时的几点： 1. 使用方法：先创建一个promise对象new Promise(),根据业务需求判断执行成功或失败，成功调用resovle(),

水深无声/ 2021年10月23日 21:26/ 0 赞/ 754 阅读