vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
2 lines (1 loc) • 2.05 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("vue"),T=(n,o,w)=>{const u=i.ref(window),s=i.ref(!1),v=i.ref(!1),d=i.ref(0),a=i.ref(0);let f=null;const p=e=>{let t=e.parentElement;for(;t;){const l=window.getComputedStyle(t);if(/(scroll|auto)/.test(l.overflowY))return t;t=t.parentElement}return window},B=e=>e instanceof Window?window.scrollY:e.scrollTop,b=i.computed(()=>s.value?{height:d.value+"px",width:a.value+"px"}:{}),x=i.computed(()=>{if(!s.value)return{};const e=u.value,t={width:a.value+"px",zIndex:n.zIndex};if(e instanceof HTMLElement)if(t.position="absolute",n.position==="top")t.top=e.scrollTop+n.offset+"px";else{const l=o.value.getBoundingClientRect(),r=e.getBoundingClientRect(),c=e.scrollHeight-(l.top+l.height-r.top);t.bottom=c<n.offset?n.offset+"px":c+"px"}else t.position="fixed",n.position==="top"?t.top=n.offset+"px":t.bottom=n.offset+"px";return t}),m=()=>{if(!o.value||!u.value)return;const e=u.value,t=B(e);let l=!1;if(n.position==="top"){const r=o.value.getBoundingClientRect(),c=e instanceof Window?0:e.getBoundingClientRect().top;l=r.top+t-c<=t+n.offset}else{const r=o.value.getBoundingClientRect();if(e instanceof Window){const c=window.innerHeight;l=r.bottom>=c-n.offset}else l=e.getBoundingClientRect().bottom-r.bottom<=n.offset}l!==s.value&&(s.value=l,w("change",s.value)),w("scroll",{scrollTop:t,fixed:s.value})},h=()=>{v.value||(requestAnimationFrame(()=>{m(),v.value=!1}),v.value=!0)},g=()=>{if(!o.value)return;const e=o.value.getBoundingClientRect();d.value=e.height,a.value=e.width,s.value&&m()};return i.onMounted(()=>{i.nextTick(()=>{if(!o.value)return;u.value=p(o.value);const e=o.value.getBoundingClientRect();d.value=e.height,a.value=e.width,s.value=!1,u.value.addEventListener("scroll",h,{passive:!0}),window.addEventListener("resize",g),f=new ResizeObserver(g),f.observe(o.value)})}),i.onUnmounted(()=>{u.value?.removeEventListener("scroll",h),window.removeEventListener("resize",g),f?.disconnect()}),{affixStyle:x,affixRefStyle:b}};exports.useAffix=T;