绑定元素“一些测试文本”隐式具有“任何”类型

Question

I´ve got problem with TS compiler, It throws me this error: Binding element " " implicitly has an "any" type.

The error is occured at the map function and for the attributes (id, title, action, backgroundColor, color).

Below is my code:

export type MessageWindowComponentProps = PropsWithChildren<{
    readonly buttonsType: ButtonsType,
    readonly saveText: string,
    readonly closeText: string,
    readonly yesText: string,
    readonly noText: string,
    readonly onSaveClick?: () => void;
    readonly onCloseClick?: () => void;
    readonly onYesClick?: () => void;
    readonly onNoClick?: () => void;
}>

const classNames = bemClassNames("message-window");
const messageWindowContent = classNames("content");
const messageWindowButtons = classNames("buttons");

export const MessageWindowComponent: FunctionComponent<MessageWindowComponentProps> = ({
    children, 
    buttonsType, 
    saveText, 
    closeText, 
    yesText, 
    noText, 
    onSaveClick, 
    onCloseClick, 
    onYesClick, 
    onNoClick,
}) => {

    const typeOfButtons = {
        [ButtonsType.yesNo]: [
            {id: 1, title: {noText}, action: onYesClick, backgroundColor: ButtonBackgroundColor.whitePrimaryFixed, color: TextColor.textPrimary},
            {id: 2, title: {yesText}, action: onNoClick, backgroundColor: ButtonBackgroundColor.colorPrimary, color: TextColor.whiteBlack},
        ],
        [ButtonsType.saveClose]: [
            {id: 3, title: {closeText}, action: onCloseClick, backgroundColor: ButtonBackgroundColor.whitePrimaryFixed, color: TextColor.textPrimary},
            {id: 4, title: {saveText}, action: onSaveClick, backgroundColor: ButtonBackgroundColor.colorPrimary, color: TextColor.whiteBlack},
        ],
        [ButtonsType.close]: [
            {id: 5, title: {closeText}, action: onCloseClick, backgroundColor: ButtonBackgroundColor.colorPrimary, color: TextColor.whiteBlack},
        ],
    };

    return (
        <div className={classNames()}>
            <div className={messageWindowContent}>
                {children}
            </div>
            <div className={messageWindowButtons}>
                <Layout justifyContent={JustifyContent.flexEnd}>
                    {typeOfButtons[buttonsType].map(({id, title, action, backgroundColor, color}) => (
                        <Layout key={id} spacingSizeLeft={SpacingSize.s}>
                            <TextButton backgroundColor={backgroundColor} color={color} shadow={false} onClick={action ?? doNothing} text={title} title={title} />
                        </Layout>
                    ))}
                </Layout>
            </div>
        </div>
    );
};

Thank you for your help.

Answer 1

Compiler suggests that typeOfButtons does not have specified type. Just add a type to this variable and it should be ok. Also check what type is ButtonsType is so you can put that type inside of a typeOfButtons type definition.