| 1 |
- import{a as E,s as T,v as A,f as u,i,a7 as B,N as I,al as M,du as k,n as o,cC as P,aw as V,ay as L,w as S,o as j,j as q,z as _,B as W,m as g,t as C}from"./index.7e08ba81.js";import{D as z}from"./index.0fba574f.js";import{P as U}from"./index.334036fa.js";import"./index.ea1692d3.js";import"./index.3132743a.js";import"./useSize.1210be5f.js";import"./eagerComputed.41f917f7.js";import"./useWindowSizeFn.9cd1b73f.js";import"./useContentViewHeight.eee5bfce.js";import"./ArrowLeftOutlined.8453d1a8.js";import"./index.492f2ae6.js";import"./transButton.38e068f8.js";const G={height:[Number,String],maxHeight:[Number,String],maxWidth:[Number,String],minHeight:[Number,String],minWidth:[Number,String],width:[Number,String],bench:{type:[Number,String],default:0},itemHeight:{type:[Number,String],required:!0},items:{type:Array,default:()=>[]}},w="virtual-scroll";function s(t,a="px"){if(!(t==null||t===""))return isNaN(+t)?String(t):`${Number(t)}${a}`}var J=E({name:"VirtualScroll",props:G,setup(t,{slots:a}){const c=T(null),n=A({first:0,last:0,scrollTop:0}),p=u(()=>parseInt(t.bench,10)),m=u(()=>parseInt(t.itemHeight,10)),d=u(()=>Math.max(0,n.first-i(p))),f=u(()=>Math.min((t.items||[]).length,n.last+i(p))),v=u(()=>({height:s((t.items||[]).length*i(m))})),h=u(()=>{const e={},r=s(t.height),l=s(t.minHeight),H=s(t.minWidth),N=s(t.maxHeight),F=s(t.maxWidth),b=s(t.width);return r&&(e.height=r),l&&(e.minHeight=l),H&&(e.minWidth=H),N&&(e.maxHeight=N),F&&(e.maxWidth=F),b&&(e.width=b),e});B([()=>t.itemHeight,()=>t.height],()=>{x()});function y(e){const r=i(c);if(!r)return 0;const l=parseInt(t.height||0,10)||r.clientHeight;return e+Math.ceil(l/i(m))}function $(){return Math.floor(n.scrollTop/i(m))}function x(){const e=i(c);!e||(n.scrollTop=e.scrollTop,n.first=$(),n.last=y(n.first))}function D(){const{items:e=[]}=t;return e.slice(i(d),i(f)).map(R)}function R(e,r){r+=i(d);const l=s(r*i(m));return o("div",{class:`${w}__item`,style:{top:l},key:r},[P(a,"default",{index:r,item:e})])}return I(()=>{n.last=y(0),M(()=>{const e=i(c);!e||k({el:e,name:"scroll",listener:x,wait:0})})}),()=>o("div",{class:w,style:i(h),ref:c},[o("div",{class:`${w}__container`,style:i(v)},[D()])])}});var K=V(J,[["__scopeId","data-v-0610daca"]]);const O=L(K);const Q=(()=>{const t=[];for(let a=1;a<2e4;a++)t.push({title:"\u5217\u8868\u9879"+a});return t})(),X=E({components:{VScroll:O,Divider:z,PageWrapper:U},setup(){return{data:Q}}}),Y={class:"virtual-scroll-demo-wrap"},Z={class:"virtual-scroll-demo__item"},tt={class:"virtual-scroll-demo-wrap"},et={class:"virtual-scroll-demo__item"};function it(t,a,c,n,p,m){const d=S("Divider"),f=S("VScroll"),v=S("PageWrapper");return j(),q(v,{class:"virtual-scroll-demo"},{default:_(()=>[o(d,null,{default:_(()=>[W("\u57FA\u7840\u6EDA\u52A8\u793A\u4F8B")]),_:1}),g("div",Y,[o(f,{itemHeight:41,items:t.data,height:300,width:300},{default:_(({item:h})=>[g("div",Z,C(h.title),1)]),_:1},8,["items"])]),o(d,null,{default:_(()=>[W("\u5373\u4F7F\u4E0D\u53EF\u89C1\uFF0C\u4E5F\u9884\u5148\u52A0\u8F7D50\u6761\u6570\u636E\uFF0C\u9632\u6B62\u7A7A\u767D")]),_:1}),g("div",tt,[o(f,{itemHeight:41,items:t.data,height:300,width:300,bench:50},{default:_(({item:h})=>[g("div",et,C(h.title),1)]),_:1},8,["items"])])]),_:1})}var ft=V(X,[["render",it],["__scopeId","data-v-918662a0"]]);export{ft as default};
|
