Typescript Stateless React Component как именованная функция

Question

Допустим, у меня есть компонент React, называемый Link:

function Link(props) {
  return <a href={props.url}>{props.children}</a>
}

Как мне набрать эту функцию, не превращая ее в функцию стрелки?

Это не похоже на работу :

interface ILink {
  url: string
}

function Link(props: React.FC<ILink>) { }

// Property 'url' does not exist on type 'FC<ILink>'.
// Property 'children' does not exist on type 'FC<ILink>'.

Но как функция стрелки она мгновенно работает?

interface ILink {
  url: string
}

const Link: React.FC<ILink> = (props) => { }

// Compiles

Answer 1

Вы должны использовать React.PropsWithChildren, поэтому оно становится:

function Link(props: React.PropsWithChildren<ILink>) { }