Typescript 元素隐式具有“any”类型，因为“any”类型的表达式不能用于索引类型

Question

I have component that accept Item, ant I use interface to describe it, but inside component I use next construction (I use another property to get currentItem field)

modalComponentsData.reduce((acc: any, el: any) => {
         acc[el.name] = currentItem[el.name]
         return acc
       }, {}),

And I get next warning

TS7053: Element implicitly has an 'any' type because expression of type 'any' can't be used to index type '{ name: string; id?: string | undefined; }'

interface IItem{
  name: string,
  id: string
}

export default function ModalGroupComponent({currentItem}: IItem{

....some logic

modalComponentsData.reduce((acc: any, el: any) => {
         acc[el.name] = currentItem[el.name]
         return acc
       }, {}),
}

Answer 1

Try this:

interface IItem {
    name: string;
    id: string;
}

interface IItemDict {
    [key: string]: IItem
}

interface IComponent {
    currentItem: IItemDict;
}

interface IElement {
    name: string;
}

export default function ModalGroupComponent({currentItem}: IComponent) {

    // ....some logic

    modalComponentsData.reduce((acc: IItemDict, el: IElement) => {
        acc[el.name] = currentItem[el.name]
        return acc
    }, {});
}