您將如何為x-tag組件定義Typescript接口簽名

Question

x-tag規范在純JS中具有以下簽名 -

xtag.register('x-accordion', {
    // extend existing elements
    extends: 'div',
    mixins: ['superdefaults', 'otherdefaults'],
    lifecycle:{
        created: function(){
            // fired once at the time a component
            // is initially created or parsed
        },
        inserted: function(){
            // fired each time a component
            // is inserted into the DOM
        },
        removed: function(){
            // fired each time an element
            // is removed from DOM
        },
        attributeChanged: function(){
            // fired when attributes are set
        }
    },
    events: {
        'click:delegate(x-toggler)': function(){
            // activate a clicked toggler
        }
    },
    accessors: {
        'togglers': {
            get: function(){
                // return all toggler children
            },
            set: function(value){
                // set the toggler children
            }
         }
    },
    methods: {
        nextToggler: function(){
            // activate the next toggler
        },
        previousToggler: function(){
            // activate the previous toggler
        }
    }
});

顯然，方法，訪問器和事件可以有多個條目。

我試圖定義傳遞給寄存器函數的對象文字的Typescript等價物。 任何人有任何想法如何實現這一目標？

Answer 1

方法，訪問器和事件的秘密在於使用字符串索引器。 我只會寫那部分，但最終還是大部分內容，所以我把它完成了。

declare module xtag {
    interface RegisterParams {
        extends?: string;
        prototype?: any;
        mixins?: string[];
        lifecycle?: {
            created?: () => void;
            inserted?: () => void;
            removed?: () => void;
            attributeChanged?: () => void;
        }
        events: { [name: string]: () => void; };
        accessors: {[name: string]: {
            get?: () => any;
            set?: (value: any) => any;
            attribute?: any;
        }};
        methods: { [name: string]: () => void; }
    }
    export function register(tagName: string, params: RegisterParams): void;
}

有索引的一個體面的解釋在這里 。 在accessors上，沒有辦法表達get和set與屬性互斥。 我們能做的最好的事情就是讓它們成為可選的。