Typescript interface extends React.FC

user_7425542 0
Viewed 614

I need to extend React.FC with custom interface like this:

interface IComponent<P = {}> extends React.FC {
  custom?: {a: string, b: string};
}

const Page:IComponent<{text: string}> = ({text}) => (
  <>{text}</>
)

Page.custom = {a: '1', b: '2'}

Page.custom is typed correctly, but React.FC props functionality is lost. How do I fix this?

typescript reactjs
2 Answers

Figured that out. I needed to pass P param from IComponent to React.FC

interface IComponent<P = {}> extends React.FC<P> {
  custom?: {a: string, b: string};
}
user_74255420

try withoutt {}

add type string


interface IComponent<P = {}> extends React.FC {
  custom?: {a: string, b: string};
}

const Page:IComponent<{text: string}> = (text:string) => (
  <>{text}</>
)

Page.custom = {a: '1', b: '2'}
user_91614780
Related