weui加载更多

weui加载更多

前提有weui对应的js和css

    var ctx =[[${session.ctx}]]
    $(function() {
        var pageNum = 1
        load(pageNum)
        var loading = false
        $(document.body).infinite().on("infinite", function() {
            if(loading) return
            loading = true
            setTimeout(function() {
                pageNum = pageNum + 1;
                load(pageNum)
                loading = false
            }, 1000)
        })
    })

    function load(pageNum, pageSize = 10) {
        axios.post('/wx/discover/getRecommend?pageNum=' + pageNum + '&pageSize=' + pageSize)
        .then(function (response) {
            if (response.data.code == 0) {
                let data = response.data.data.items
                let count = response.data.data.count
                if (data.length == 0 || data.length == count) {
                    //没有数据时
                    $(document.body).destroyInfinite()
                    $(".weui-loadmore").html('<div class="weui-loadmore weui-loadmore_line"> <span class="weui-loadmore__tips">暂无数据</span> </div>')
                }
                var html = ''
                for (let item of data) {
                    // 设置时间格式
                    var contentDatetime = item.contentDatetime
                    if (contentDatetime) {
                        contentDatetime = contentDatetime.split(" ")[0].replaceAll("-", "/")
                    }
                    // 设置来源格式
                    let contentSource = item.contentSource
                    if (!contentSource) {
                        contentSource = ''
                    }
                    html += '<li id="li_'+ item.id +'">' +
                        '<div class="article-tit01">' +
                        '<span class="'+ tagColor +'">'+ item.categoryTitle + '</span>' +
                        '<h5>'+ item.contentTitle +'</h5>' +
                        '</div>' +
                        '<div class="article-info01">' +
                        '<span>发布时间：'+ contentDatetime +'</span>' +
                        '<span>来源：'+ contentSource +'</span>' +
                        '</div>' +
                        '</li>'
                    $(document).on('click', '#li_' + item.id, function() {
                        window.location.href = ctx + '/discover/detail/' + item.id
                    })
                }
                $("#list").append(html)
            }
        })
        .catch(function (error) {
            console.log(error);
        })
        .finally(function () {
        });
    }

参考链接：https://blog.csdn.net/weixin_33782386/article/details/86362433