反应儿童的正确 typescript 类型是什么？

Question

I'm trying to properly type the props for a component that maps children:

type Props = {
    children: any
}

const MyComponent: FunctionComponent<Props> = () => (React.Children.map(children, someMapingFunction);

I've been using JSX.Element but that doesn't quite feel right.

Answer 1

Looking through the code under DefinitelyTyped it appears that children is typed as ReactNode .

Example:

type Props = {
    children: ReactNode
}

const MyComponent: FunctionComponent<Props> = () => (React.Children.map(children, someMapingFunction);

Note : The ReactNode type can be found in the React namespace:

import React from 'react';

let someNode: React.ReactNode;

Answer 2

Actually you don't have to specify children if you're using React.FunctionComponent .

For example the following codes compile without error:

const MyComponent: React.FC<{}> = props => {
  return props.children
}