微信小程序使用Promise异步请求

 在微信小程序中，如果你希望在一个 HTTP 请求完成后再继续执行下面的代码，可以将后续代码放入请求的回调函数中。如果不想使用嵌套的回调函数，可以考虑使用 Promise 来处理异步请求。这样可以更清晰地组织代码，还能避免“回调地狱”的问题。

这是原方法并不会在执行完http请求后再往下执行，在执行http请求的时候同时执行listItem3,导致listItem3为空。

    

    list: function (page) {
        var that = this;
        wx.showLoading({
            title: '加载中',
        })
        that.data.loading = true;
        let listItem = that.data.listItem;
        http.get('/********', { page: page }, function (res) {
            that.data.loading = false;
            wx.hideLoading()
            if (res && res.code == 1) {
                var list = res.data.list;
                if (list.length > 0) {
                    list.forEach(function (o) {
                        o.isN6 = 1
                        listItem.push(o)
                    })
                }
                that.setData({
                    listItem: listItem,
                    page: res.data.curr_page,
                    isLastPage: res.data.is_last_page,
                });
            }
        })

        let listItem2 = that.data.listItem2;

        http.get('/********', { page: page }, function (res) {

            if (res && res.code == 1) {
                var list = res.data.list;
                if (list.length > 0) {
                    list.forEach(function (o) {
                        listItem2.push(o)
                    })
                }
                that.setData({
                    listItem2: listItem2,
                    page: res.data.curr_page,
                    isLastPage2: res.data.is_last_page,
                });


            }
        })

        let listItem3 = [...that.data.listItem, ...that.data.listItem2]
        listItem3 = listItem3.sort((a, b) => new Date(a.add_time).getTime() - new Date(b.add_time).getTime())
        that.setData({ listItems: listItem3 })

    },

将 HTTP 请求封装成 Promise，使得可以使用 .then() 和 .catch() 来处理结果和错误，使用 Promise.all 来并行处理多个请求，确保两个请求都完成后再执行后续逻辑。

list: function (page) {
        var that = this;
        wx.showLoading({
            title: '加载中',
        });

        that.data.loading = true;

        // 定义返回 Promise 的函数  
        const getListN6Notify = (page) => {
            return new Promise((resolve, reject) => {
                http.get('/*********', { page: page }, function (res) {
                    that.data.loading = false;
                    wx.hideLoading();
                    if (res && res.code == 1) {
                        var list = res.data.list;
                        if (list.length > 0) {
                            list.forEach(function (o) {
                                o.isN6 = 1;
                                that.data.listItem.push(o);
                            });
                        }
                        that.setData({
                            listItem: that.data.listItem,
                            page: res.data.curr_page,
                            isLastPage: res.data.is_last_page,
                        });
                        resolve();  // 请求完成，解析 Promise  
                    } else {
                        reject(new Error('请求失败'));  // 处理错误情况  
                    }
                });
            });
        };

        const getListN8Notify = (page) => {
            return new Promise((resolve, reject) => {
                http.get('/********', { page: page }, function (res) {
                    if (res && res.code == 1) {
                        var list = res.data.list;
                        if (list.length > 0) {
                            list.forEach(function (o) {
                                that.data.listItem2.push(o);
                            });
                        }
                        that.setData({
                            listItem2: that.data.listItem2,
                            page: res.data.curr_page,
                            isLastPage2: res.data.is_last_page,
                        });
                        resolve();  // 请求完成，解析 Promise  
                    } else {
                        reject(new Error('请求失败'));  // 处理错误情况  
                    }
                });
            });
        };

        // 并行执行两个请求  
        Promise.all([getListN6Notify(page), getListN8Notify(page)]).then(() => {
            // 所有请求完成后执行  
            let listItem3 = [...that.data.listItem, ...that.data.listItem2];
              
            listItem3.sort((a, b) => {
                // 解析 add_time 字符串为 Date 对象  
                const dateA = new Date(a.add_time.replace(/年|月/g, '-').replace(/日/g, ''));
                const dateB = new Date(b.add_time.replace(/年|月/g, '-').replace(/日/g, ''));
                return dateB - dateA; // 比较时间  
            });
            that.setData({ listItems: listItem3 });

        }).catch((error) => {
           
        });
    },

在 JavaScript 中，日期的比较需要将日期字符串转换为可以比较的格式。由于日期格式是 "YYYY年MM月DD日 HH:mm" 的形式，直接使用 new Date() 可能无法正确解析。为了进行正确的排序，需要将日期字符串转换为标准的日期格式。可以使用 Date.parse() 或者手动解析日期字符串。