ES6中Promise封装ajax的写法

最新推荐文章于 2022-10-27 18:31:29 发布

转载最新推荐文章于 2022-10-27 18:31:29 发布 · 335 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/tonnytong/p/10983246.html

文章标签：

#javascript #json #ViewUI

本文介绍了一种使用Promise封装Ajax的方法，分别提供了依赖于jQuery和不依赖于jQuery的两种实现方式。通过示例展示了如何调用封装后的Ajax函数，并处理成功和失败的情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.依赖jquery的写法可以使用下面的

    (function($){
        $.extend({
            ajaxPromise:  param => {
                return new Promise((resolve, reject) => {
                    $.ajax({
                        method: param.method || "GET",
                        dataType: "JSON",
                        url: param.url,
                        data: param.data || "",
                        success: res => {
                            if (res.status == 1) {
                                resolve(res.data);
                            }
                            else if (res.status == -1001) {
                                console.log("需要登录");
                            }
                        },
                        error: err => {
                            if (err.status == 404) {
                                console.log("404");
                            } else {
                                reject(err);
                            }
                        }
                    })
                })
            }
        })
    })(jQuery);

2.如果不依赖jquery可以采用下面的写法

const ajaxPromise =  param => {
        return new Promise((resolve, reject) => {
            $.ajax({
                type: param.type || "get",
                url: param.url,
                data: param.data || "",
                success: res => {
                    if(res.status == 1){
                        resolve(res.data);
                    }
                    else if(res.status == -1001){
                        alert("需要登录");
                    }else{

                    }
                },
                error: err => {
                    if(err.status == 404){
                        alert("404");
                    }else{
                        reject(err);
                    }
                }
            })
        })
    };

使用jquery示例

　　/*
     第一个请求
     */
    let step1 = () => {
        $.ajaxPromise({
            url:"agents/get/2068957732939648",
            data: {
                "token":"f59e423eb75503f5609a0b9ba3b38db8083ad65078edb945b4c528fe6440b728"
            }
        }).then(res => {
            console.log("第一个请求正确返回==>"+res);
        }).catch(err => {
            console.log("第一个请求失败",err);
        })
    };

    /*
     第二个请求
     */
    let step2 = () => {
        $.ajaxPromise({
            url:"http://staging.santezjy.com:1031/agents/get/2068957732939648",
            data: {
                "token":"f59e423eb75503f5609a0b9ba3b38db8083ad65078edb945b4c528fe6440b728"
            }
        }).then(res => {
            console.log("第二个请求正确返回==>",res);
        }).catch(err => {
            console.log("第二个请求失败==>"+err);
        })
    };

    step1();
    step2();

转载于:https://www.cnblogs.com/tonnytong/p/10983246.html