mine-h5-ui
Version:
一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍
36 lines (35 loc) • 1.27 kB
JavaScript
import { ref as M, watch as T } from "vue";
/*!
* mine-h5-ui v2.15.0
* Copyright (c) 2025 biaov
* @license MIT
*/
const g = ({ props: e, emit: o, modelValue: c }) => {
const m = M(100);
let a = 0, s = 0, l = 0;
const h = () => {
m.value = 100 + e.min - c.value;
}, r = (n) => {
a = n.changedTouches[0].clientX, s = c.value, l = document.body.offsetWidth, o("start", n);
}, f = (n) => {
const d = n.changedTouches[0].clientX, u = Math.ceil((d - a) * 100 / l);
let t = s + u;
t = u > 0 ? t > e.max ? e.max : t : t < e.min ? e.min : t, c.value = t, o("move", n);
}, i = (n) => {
o("end", n);
}, v = (n) => {
const d = n.clientX, u = Math.ceil((d - a) * 100 / l);
let t = s + u;
t = u > 0 ? t > e.max ? e.max : t : t < e.min ? e.min : t, c.value = t, o("move", n);
}, X = (n) => {
document.onmousemove = null, document.onmouseup = null, o("end", n);
}, x = (n) => {
a = n.clientX, s = c.value, l = document.body.offsetWidth, document.onmousemove = v, document.onmouseup = X, o("start", n);
};
return T(c, () => {
!e.disabled && h();
}), h(), { currentValue: m, onTouchstart: r, onTouchmove: f, onTouchend: i, onMousedown: x };
};
export {
g as useHandler
};