Object of objects of arrays in Typescript

613 views Asked by At

I have a structure like that and need to make a definitions of types / interfaces for that but I can't make this working properly.

layoutsSet: {
       1: {
        "lg": [
            {
                i: "1",
                x: 0,
                y: 0,
                w: 2,
                h: 2
            },
            {
                i: "2",
                x: 2,
                y: 0,
                w: 2,
                h: 2
            },
            {
                i: "3",
                x: 4,
                y: 0,
                w: 2,
                h: 2
            },
        ]
    }
};

Thats how it looks like for now. It needs some changes because in compilation Im getting errors:

TS2322: Type '{ "lg": { i: string; x: number; y: number; w: number; h: number; }[]; }' is not assignable to type 'Layouts'. Property 'md' is missing in type '{ "lg": { i: string; x: number; y: number; w: number; h: number; }[]; }'.

export interface Layout {
    i: string;
    x: number;
    y: number;
    w: number;
    h: number;
}

export enum Breakpoint {
    LG = "lg",
    MD = "md",
    SM = "sm",
    XS = "xs",
    XXS = "xxs"
}

export interface LayoutBreakpoint extends Array<Layout> {}

export type Layouts = {
    [b in Breakpoint]: LayoutBreakpoint
}

export interface LayoutsSet {
    [index: number]: Layouts
}

What should i change here to make it works? Can anyone help me please?

// EDIT

The best part is that when Ive changed

export type Layouts = {
    [key: string]: LayoutBreakpoint
}

It is working now...

But why cant I define index as an enum type?

1

There are 1 answers

1
Sachin Gupta On

in interface LayoutsSet you are defining index as a number type. the variable names cannot be of type number.