diff --git a/src/components/Button/index.vue b/src/components/Button/index.vue index c387b1fcc5d..28c54f40bdc 100644 --- a/src/components/Button/index.vue +++ b/src/components/Button/index.vue @@ -1,23 +1,20 @@ diff --git a/src/components/ClickOutSide/index.vue b/src/components/ClickOutSide/index.vue index 4a9965f1c68..62566cf1243 100644 --- a/src/components/ClickOutSide/index.vue +++ b/src/components/ClickOutSide/index.vue @@ -12,9 +12,11 @@ setup(_, { emit }) { const wrapRef = ref>(null); + useClickOutside(wrapRef as Ref, () => { emit('clickOutside'); }); + return { wrapRef }; }, }); diff --git a/src/components/Scrollbar/src/Bar.tsx b/src/components/Scrollbar/src/Bar.tsx index c96922f974f..ca14c1aeee4 100644 --- a/src/components/Scrollbar/src/Bar.tsx +++ b/src/components/Scrollbar/src/Bar.tsx @@ -17,7 +17,7 @@ export default defineComponent({ setup(props) { const thumbRef = ref>(null); const elRef = ref>(null); - const commonState = reactive({}); + const commonState = reactive({}); const getBarRef = computed(() => { return BAR_MAP[props.vertical ? 'vertical' : 'horizontal']; }); diff --git a/src/setup/directives/repeatClick.ts b/src/setup/directives/repeatClick.ts new file mode 100644 index 00000000000..994de69398d --- /dev/null +++ b/src/setup/directives/repeatClick.ts @@ -0,0 +1,24 @@ +import { on, once } from '/@/utils/domUtils'; + +export default { + beforeMount(el: Element, binding: any) { + let interval: ReturnType | null = null; + let startTime = 0; + const handler = () => binding.value && binding.value(); + const clear = () => { + if (Date.now() - startTime < 100) { + handler(); + } + interval && clearInterval(interval); + interval = null; + }; + + on(el, 'mousedown', (e) => { + if ((e as any).button !== 0) return; + startTime = Date.now(); + once(document as any, 'mouseup', clear); + interval && clearInterval(interval); + interval = setInterval(handler, 100); + }); + }, +}; diff --git a/src/types/global.d.ts b/src/types/global.d.ts index edbd9b4d927..69645d681ed 100644 --- a/src/types/global.d.ts +++ b/src/types/global.d.ts @@ -23,15 +23,12 @@ declare type RefType = T | null; declare type CustomizedHTMLElement = HTMLElement & T; -declare type Indexable = { +declare type Indexable = { [key: string]: T; }; +declare type Hash = Indexable; -declare type KeyString = { - [key: string]: T; -}; - -type DeepPartial = { +declare type DeepPartial = { [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial[] : T[P] extends object @@ -39,11 +36,11 @@ type DeepPartial = { : T[P]; }; -type SelectOptions = { +declare type SelectOptions = { label: string; value: any; }[]; -type EmitType = (event: string, ...args: any[]) => void; +declare type EmitType = (event: string, ...args: any[]) => void; -type TargetContext = '_self' | '_blank'; +declare type TargetContext = '_self' | '_blank'; diff --git a/src/utils/domUtils.ts b/src/utils/domUtils.ts index 184a9fcf2ed..a1528a3f3bc 100644 --- a/src/utils/domUtils.ts +++ b/src/utils/domUtils.ts @@ -15,9 +15,11 @@ export function getBoundingClientRect(element: Element): DOMRect | number { } return element.getBoundingClientRect(); } + const trim = function (string: string) { return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, ''); }; + /* istanbul ignore next */ export function hasClass(el: Element, cls: string) { if (!el || !cls) return false; @@ -28,6 +30,7 @@ export function hasClass(el: Element, cls: string) { return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1; } } + /* istanbul ignore next */ export function addClass(el: Element, cls: string) { if (!el) return; @@ -130,7 +133,7 @@ export function hackCss(attr: string, value: string) { /* istanbul ignore next */ export const on = function ( - element: HTMLElement | Document | Window, + element: Element | HTMLElement | Document | Window, event: string, handler: EventListenerOrEventListenerObject ): void { @@ -141,7 +144,7 @@ export const on = function ( /* istanbul ignore next */ export const off = function ( - element: HTMLElement | Document | Window, + element: Element | HTMLElement | Document | Window, event: string, handler: Fn ): void { @@ -149,3 +152,14 @@ export const off = function ( element.removeEventListener(event, handler, false); } }; + +/* istanbul ignore next */ +export const once = function (el: HTMLElement, event: string, fn: EventListener): void { + const listener = function (this: any, ...args: unknown[]) { + if (fn) { + fn.apply(this, args); + } + off(el, event, listener); + }; + on(el, event, listener); +};