vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
2 lines (1 loc) • 1.26 kB
JavaScript
"use strict";const e=require("vue"),g=require("./hook/useVirtualList.cjs"),k=e.defineComponent({name:"VirtualList",__name:"index",props:{list:{default:()=>[]},itemSize:{default:50},height:{default:500},overscan:{default:5}},setup(u,{expose:a}){const c=u,s=e.useTemplateRef("virtualListEl"),{itemHeight:i,startIndex:t,totalHeight:p,heightStyle:f,visibleItems:m,onScroll:o,scrollToTop:d,scrollToBottom:v,scrollToIndex:h}=g.useVirtualList(c,s);return a({scrollToTop:d,scrollToBottom:v,scrollToIndex:h}),(y,n)=>(e.openBlock(),e.createElementBlock("div",{class:"app-virtual-list",style:e.normalizeStyle({height:e.unref(f)})},[e.createElementVNode("div",{ref_key:"virtualListEl",ref:s,class:"virtual-scroll",onScroll:n[0]||(n[0]=(...l)=>e.unref(o)&&e.unref(o)(...l))},[e.createElementVNode("div",{class:"virtual-list",style:e.normalizeStyle({height:e.unref(p)+"px",position:"relative"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(m),(l,r)=>(e.openBlock(),e.createElementBlock("div",{key:e.unref(t)+r,class:"virtual-item",style:e.normalizeStyle({position:"absolute",top:(e.unref(t)+r)*e.unref(i)+"px",height:e.unref(i)+"px"})},[e.renderSlot(y.$slots,"default",{item:l,index:e.unref(t)+r})],4))),128))],4)],544)],4))}});module.exports=k;