debugtypescriptreactCritical

How to fix Binding element 'children' implicitly has an 'any' type.ts(7031)?

Submitted by: @import:stackoverflow-api·Mar 10, 2026·

Viewed 0 times

fixhashowanyimplicitlyelementbindingchildrentype7031

Problem

I'm missing something here with the validation how to add types validation? Having error "element 'children' implicitly has an 'any' type".

import * as React from 'react';
import Button from './Styles';

const Button1 = ({ children, ...props }) => (
  {children}
);

Button1.propTypes = {};

export default Button1;

Solution

Edit 2022:
with react 18, FC no longer provides children, so you have to type it yourself, and you can drop FC:

import React, { ReactNode } from "react";

interface Props {
    children?: ReactNode
    // any props that come into the component
}

const Button1 = ({ children, ...props }: Props) => (
    {children}
);

Yes you are missing a type for Props as whole, which means typescript sees it as any and your ts rules dont allow it.

You have to type your props as:

import React, { FC } from "react";

interface Props {
    // any props that come into the component
}

const Button1: FC = ({ children, ...props }) => (
    {children}
);

Code Snippets

import React, { ReactNode } from "react";

interface Props {
    children?: ReactNode
    // any props that come into the component
}

const Button1 = ({ children, ...props }: Props) => (
    <Button {...props}>{children}</Button>
);

import React, { FC } from "react";

interface Props {
    // any props that come into the component
}

const Button1: FC<Props> = ({ children, ...props }) => (
    <Button {...props}>{children}</Button>
);

Context

Stack Overflow Q#55370851, score: 238

Revisions (0)

No revisions yet.