reactjs - 我应该为 child 的 TypeScript Prop 使用什么类型？

Question

我正在做:

export default function PageTitle(props: ReactElement) {
  return (
    <Typography variant='h3' style={{ fontWeight: 600 }} gutterBottom={true} {...props}>{props.children}</Typography>
  )
}

但我收到投诉:

Type error: Property 'children' does not exist on type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)>) | (new (props: any) => Component<any, any, any>)>'

什么是正确使用的类型？

Answer 1

我会这样写

   type Props = {
      children: string;
    };

     const PageTitle : React.FC<Props> = (props) => {
      return (
        <Typography variant='h3' style={{ fontWeight: 600 }} gutterBottom={true} {...props}>{props.children}</Typography>
      )
    }

    export default PageTitle;

或者像这样

type Props = {
  children: string;
};

 const PageTitle = ({children, ...props}: Props) => {
  return (
    <Typography variant='h3' style={{ fontWeight: 600 }} gutterBottom={true} {...props}>{children}</Typography>
  )
}

export default PageTitle;