Построить универсальный c интерфейс с машинописью

Question

Мне трудно создать интерфейс, который будет представлять состояние компонента. Предположим следующее:

interface IFoo {
    fooName: string;
    fooValue: string | boolean | Array<string>
}

Тогда у нас есть следующие объекты:

const objOne: IFoo = {
    fooName: 'objOneName',
    fooValue: true
}

const objTwo: IFoo = {
    fooName: 'objTwoName',
    fooValue: ['a', 'b', 'c']
}

Теперь у нас есть массив с этими объектами:

const myArray: IFoo[] = [objOne, objTwo];

Сейчас в компонент React Я получил myArray в качестве подпорки и должен создать интерфейс для состояния компонента.

Мне нужен новый интерфейс, который будет представлять состояние компонента реагирования, и он должен выглядеть примерно так:

interface myState { 
    someProp: string;
    // The following values need to be dynamic. I don't know how many entries are there in the array 
    // in the is example: objOneName is the value of objOne[fooName] and it's type is the type of obj[fooValue]
    objOneName: boolean,
    objTwoName: Array<string>
}

Answer 1

Вы можете создать следующий шаблон: c prop

interface ArbitraryProps {
    [key: string]: string | boolean | Array<string>
}

interface myState extends ArbitraryProps { 
    someProp: string;
}

Я извлек ArbitraryProps в качестве отдельного интерфейса, потому что я думаю, что вы хотите перепроверять реквизиты, которые вы отправляете через него свой компонент. Кроме того, этот подход может быть слишком свободным, но это похоже на то, чего мы можем достичь, только переосмыслив дизайн здесь ...