ant-design/components/_util/throttleByAnimationFrame.tsx
偏右 fc5e0a9155
test: 100% coverage (#26839)
* test: isStyleSupport

* test: 100% test coverage
2020-09-21 18:32:24 +08:00

51 lines
1.4 KiB
TypeScript

import raf from 'raf';
export function throttleByAnimationFrame(fn: (...args: any[]) => void) {
let requestId: number | null;
const later = (args: any[]) => () => {
requestId = null;
fn(...args);
};
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) {
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;
}
const boundFn = throttleByAnimationFrame(fn.bind(this));
definingProperty = true;
Object.defineProperty(this, key, {
value: boundFn,
configurable: true,
writable: true,
});
definingProperty = false;
return boundFn;
},
};
};
}