vue3 骨架屏+上拉加载更多封装

vue3 骨架屏+上拉加载更多封装

• 介绍
  因业务需求要用到滚动加载，就用到了vant组件库里的List组件，然后突发奇想封装了个骨架屏进去，api和使用方法还有文档都参考了vant的list组件，不过没有参考源码，此组件是我第一次封装，比较贴合自身业务，所以不太符合需求的同学可以直接修改源码使用，感谢vant团队！vant的List组件地址 （https://vant-contrib.gitee.io/vant/v3/#/zh-CN/list）

  提供骨架屏展示、瀑布流滚动加载，用于展示长列表，当列表即将滚动到底部时，会触发事件并加载更多列表项。

• 效果
  

• 引入

	import ListView from '@/components/list_view/list_view.vue'
	components:{
   
        ListView
    }

• 代码演示
  – 用法

<div class="router_view" style="height:800px;overflow-y: auto;">
	<ListView 
        :list-data="data"  
        :bind-scroll-document="routerView" 
        :empty-item="emptyItem" 
        :finished="finished"
        v-model:loading="showLoading"
        v-model:error="showError"
        @load="requestData"
        v-slot="{ item }"
        >
          <div class="item row-center item-between">
                <img
                    class="item_pic"
                    :src="item.full_photo"
                />
                <div class