ant-design-vue/components/_util/throttleByAnimationFrame.ts

46 lines
1.2 KiB
TypeScript
Raw Normal View History

2020-10-13 22:26:56 +08:00
export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
let requestId: number | null;
2017-12-07 18:33:33 +08:00
2020-10-13 22:26:56 +08:00
const later = (args: any[]) => () => {
2019-01-12 11:33:27 +08:00
requestId = null;
fn(...args);
};
2017-12-07 18:33:33 +08:00
2020-10-13 22:26:56 +08:00
const throttled = (...args: any[]) => {
2017-12-07 18:33:33 +08:00
if (requestId == null) {
requestId = requestAnimationFrame(later(args));
2017-12-07 18:33:33 +08:00
}
2019-01-12 11:33:27 +08:00
};
2017-12-07 18:33:33 +08:00
(throttled as any).cancel = () => cancelAnimationFrame(requestId!);
2017-12-07 18:33:33 +08:00
2019-01-12 11:33:27 +08:00
return throttled;
2017-12-07 18:33:33 +08:00
}
2019-01-12 11:33:27 +08:00
export function throttleByAnimationFrameDecorator() {
2020-10-13 22:26:56 +08:00
// eslint-disable-next-line func-names
return function(target: any, key: string, descriptor: any) {
2019-01-12 11:33:27 +08:00
const fn = descriptor.value;
let definingProperty = false;
2017-12-07 18:33:33 +08:00
return {
configurable: true,
2019-01-12 11:33:27 +08:00
get() {
2020-10-13 22:26:56 +08:00
// eslint-disable-next-line no-prototype-builtins
2017-12-07 18:33:33 +08:00
if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
2019-01-12 11:33:27 +08:00
return fn;
2017-12-07 18:33:33 +08:00
}
2019-01-12 11:33:27 +08:00
const boundFn = throttleByAnimationFrame(fn.bind(this));
definingProperty = true;
2017-12-07 18:33:33 +08:00
Object.defineProperty(this, key, {
value: boundFn,
configurable: true,
writable: true,
2019-01-12 11:33:27 +08:00
});
definingProperty = false;
return boundFn;
2017-12-07 18:33:33 +08:00
},
2019-01-12 11:33:27 +08:00
};
};
2017-12-07 18:33:33 +08:00
}