正在为detect-element-resize.js编写TypeScript定义文件(.d.ts)

Writing TypeScript definition file (.d.ts) for detect-element-resize.js

本文关键字:文件 ts 定义 TypeScript detect-element-resize js 编写      更新时间:2023-09-26

这个JS文件的d.ts文件会是什么样子?这是项目页面。我一直在想如何编写定义文件,但它看起来真的很复杂,我想在这里问会更容易,因为我只会使用两个函数。

我要使用的功能如下:

window.addResizeListener = function(element, fn){
    if (attachEvent) element.attachEvent('onresize', fn);
    else {
        if (!element.__resizeTriggers__) {
            if (getComputedStyle(element).position == 'static') element.style.position = 'relative';
            createStyles();
            element.__resizeLast__ = {};
            element.__resizeListeners__ = [];
            (element.__resizeTriggers__ = document.createElement('div')).className = 'resize-triggers';
            element.__resizeTriggers__.innerHTML = '<div class="expand-trigger"><div></div></div>' +
                                                                                    '<div class="contract-trigger"></div>';
            element.appendChild(element.__resizeTriggers__);
            resetTriggers(element);
            element.addEventListener('scroll', scrollListener, true);
            /* Listen for a css animation to detect element display/re-attach */
            animationstartevent && element.__resizeTriggers__.addEventListener(animationstartevent, function(e) {
                if(e.animationName == animationName)
                    resetTriggers(element);
            });
        }
        element.__resizeListeners__.push(fn);
    }
};
window.removeResizeListener = function(element, fn){
    if (attachEvent) element.detachEvent('onresize', fn);
    else {
        element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
        if (!element.__resizeListeners__.length) {
                element.removeEventListener('scroll', scrollListener);
                element.__resizeTriggers__ = !element.removeChild(element.__resizeTriggers__);
        }
    }
}

试试这个:

declare interface Window {
    addResizeListener(element: HTMLElement, fn: () => any);
    removeResizeListener(element: HTMLElement, fn: () => any);
}
declare function addResizeListener(element: HTMLElement, fn: () => any);
declare function removeResizeListener(element: HTMLElement, fn: () => any);