Home > Software design >  Property 'children' does not exist on type after assigning type React.FC to component
Property 'children' does not exist on type after assigning type React.FC to component

Time:04-20

I have assigned type React.FC to my component but I still dont't have access to the children props. I get this error "Property 'children' does not exist on type 'ButtonProps'". Is there another reason why I can't access the children props?

import React from 'react'

export interface ButtonProps{
    label:string;
}

const Button:React.FC<ButtonProps> = (props) => {
  const {children} = props
  return <div>{children}</div>
}

export default Button

CodePudding user response:

Using React.FC is discouraged, so for now you should define the type of your component and be explicit about its children prop like this:

export interface ButtonProps{
    label:string;
    children: React.ReactNode
}

const Button = (props: ButtonProps) => {
  const {children} = props
  return <div>{children}</div>
}
  • Related