最新
版块
发主题
搜索
我的

海洋cms axios JS问题

qq3463883 1月前 229

目的想给列表页做一个 拉下 或者可以说是滚动到底部 在当前页面加载更多列表的模版


结果提示Uncaught (in promise) ReferenceError: axios is not defined错误 

找不到axios文件   不知道海洋的axios文件需要自己生成还是有自带的


下面列出我的JS 大家帮我看看啥问题

// 获取列表
async function getList (page = 1) {
    let res = await axios.get('https://cdn.bootcdn.net/ajax/libs/axios/1.5.0/axios.js');
    if (res.status === 200) {
        let data = sliceData(res.data);
        pages = data.pages;
        total = res.data.length;
        datas = [...data.list];
        return {
            code: 200,
            msg: 'get_succ',
            data: {
                list: data.list[page-1],
                current: page,
                pages: data.pages,
                total: list.length,
            }
        }
    }
}
// 处理数据
function sliceData (list) {  
    let newArr = [],step = 9,pages = Math.ceil(list.length/9);
    for (let i = 0; i < list.length; i+=step) {
        let item = list.slice(i, i+step);
        newArr.push(item);
    }
    return {
        list: newArr,
        pages,
    };
}
// 显示列表
async function showList (current) {
    let data = null;
    loadMore.className = '.loadmore';
    if (datas && datas.length) {
        data = {
            code: 200,
            msg: 'get_succ',
            data: {
                list: datas[current-1],
                current: current,
                pages,
                total,
            }
        }
    } else {
        data = await getList(current);
    }
    if (data.code === 200) {
        let list = data.data.list;
        if (list && list.length) {
            let liStr = '',pageStr = '';
            for (const item of list) {
                liStr += `<li>
{seacms:channellist size=9 order=time}
<a href="[channellist:playlink]"><img src="[channellist:pic]"><h3>[channellist:name len=8]</h3><span class="movie_date">[channellist:note]</span></a>
{/seacms:channellist}
                    <h3>${item.title}</h3>
                    <p>${item.body}</p>
                </li>`;
            }
            listElem.innerHTML += liStr;
        } else {
            listElem.innerHTML = '<li class="nodata">暂无数据<li>';
        }
        setTimeout(() => {
            loadMore.className = 'loadmore hide';
        }, 1000);
    }
}
document.addEventListener('scroll', checkScroll, false);
function checkScroll () {  
    let scrollTop = document.documentElement.scrollTop,
    clientHei = document.documentElement.clientHeight,
    scrollHeight = document.documentElement.scrollHeight;
    if (scrollTop + clientHei >= scrollHeight) {
        addList();
    }
}
// 切换页面
function addList () {
    if (current < pages) {
        current+=1;
        showList(current);
    } else {
        loadMore.innerText = '没有更多了';
    }
}
// 显示高亮
function showHighLight (current, bid) {
    let btns = document.querySelectorAll('.page'),
    startBtn = document.getElementById('start'),
    endBtn = document.getElementById('end');
    for (const item of btns) {
        item.className = 'page';
    }
    btns[current-1].className = 'page active';
    startBtn.className = current == 1 ? 'active dis' : '';
    endBtn.className = current == pages ? 'active dis' : '';
}


最新回复 (1)
  • 海洋 1月前
    0 引用 2
    海洋cms不包含这个js调用
返回