vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
29 lines (28 loc) • 940 B
JavaScript
import { inject as W, ref as i } from "vue";
const S = (r) => {
const m = W("scrollBarContext"), u = i(0), d = i(0), g = i(""), v = i(""), c = i(1), a = i(1), o = 4;
return {
moveX: u,
moveY: d,
ratioX: a,
ratioY: c,
sizeWidth: g,
sizeHeight: v,
handleScroll: (t) => {
if (t) {
const e = t.offsetHeight - o, s = t.offsetWidth - o;
d.value = t.scrollTop * 100 / e * c.value, u.value = t.scrollLeft * 100 / s * a.value;
}
},
update: () => {
const t = m?.scrollWrapEl;
if (!t)
return;
const e = t.offsetHeight - o, s = t.offsetWidth - o, f = e ** 2 / t.scrollHeight, h = s ** 2 / t.scrollWidth, l = Math.max(f, r.minSize), n = Math.max(h, r.minSize);
c.value = f / (e - f) / (l / (e - l)), a.value = h / (s - h) / (n / (s - n)), v.value = l + o < e ? `${l}px` : "", g.value = n + o < s ? `${n}px` : "";
}
};
};
export {
S as useBar
};