Data数据无限滚动

Infinite Scroll无限滚动，当滚动至底部时，加载更多数据。

代码

<script>
	// 获取基础列表数据渲染
    const goodList = ref([])
    const requestData = ref({
        page: 1,
        pageSize: 20,
        categoryId: route.params.id,
        sortField: 'publishTime'
    })
	// 加载更多数据
	
    const disabled = ref(false)
    const load = async () => {
    	console.log(requestData.value.page)
        // 获取下一页数据
        requestData.value.page += 1
        const res = await getSubCategoryAPI(requestData.value)
        // 合并数据
        goodList.value = [...goodList.value, ...res.data.result.items]
        // 判断是否还有下一页数据
        // res.data.result.items.length == 0 ? disabled.value = true : disabled.value = false
        if (res.data.result.items.length === 0) {
            disabled.value = true
        }
    }
</script>
<template>
	<!-- 注意这里的:infinite-scroll-disabled前要加冒号：-->
	<div class="body"  v-infinite-scroll="load" :infinite-scroll-disabled="disabled">
	   <!-- 商品列表-->
	    <GoodItem :goods="goodList" />
	</div>
</template>

实现效果