ant-design/components/_util/throttleByAnimationFrame.tsx

51 lines
1.4 KiB
TypeScript
Raw Normal View History

import raf from 'raf';
export function throttleByAnimationFrame(fn: (...args: any[]) => void) {
2017-11-22 12:06:49 +08:00
let requestId: number | null;
2017-11-22 12:06:49 +08:00
const later = (args: any[]) => () => {
requestId = null;
fn(...args);
};
2017-11-22 12:06:49 +08:00
const throttled = (...args: any[]) => {
if (requestId == null) {
requestId = raf(later(args));
}
};
(throttled as any).cancel = () => raf.cancel(requestId!);
return throttled;
}
export function throttleByAnimationFrameDecorator() {
return function throttle(target: any, key: string, descriptor: any) {
2018-11-10 00:38:06 +08:00
const fn = descriptor.value;
let definingProperty = false;
return {
configurable: true,
get() {
// In IE11 calling Object.defineProperty has a side-effect of evaluating the
// getter for the property which is being replaced. This causes infinite
// recursion and an "Out of stack space" error.
// eslint-disable-next-line no-prototype-builtins
if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
/* istanbul ignore next */
return fn;
}
2018-11-10 00:38:06 +08:00
const boundFn = throttleByAnimationFrame(fn.bind(this));
definingProperty = true;
Object.defineProperty(this, key, {
value: boundFn,
configurable: true,
writable: true,
});
definingProperty = false;
return boundFn;
},
};
};
}