> Как использовать типизацию React.FC и почему не указывать children в интерфейсе (React)

React.FC (или React.FunctionComponent) - это тип для функциональных компонентов в React. Он автоматически добавляет в пропсы children (тип React.ReactNode), что может быть нежелательно, если компонент не предполагает вложенного содержимого. Например:

TSX
interface MyProps {
  title: string;
}

const MyComponent: React.FC<MyProps> = ({ title }) => <h1>{title}</h1>;

Здесь children будет доступен, даже если он не нужен, что может привести к ошибкам или излишней гибкости. Лучше явно указывать пропсы без React.FC:

TSX
interface MyProps {
  title: string;
  children?: React.ReactNode; // добавляем только если нужно
}

const MyComponent = ({ title }: MyProps) => <h1>{title}</h1>;

Почему не указывать children в интерфейсе по умолчанию? Потому что не все компоненты должны принимать дочерние элементы. Например, кнопка с текстом - да, а иконка или изображение - нет. Явное объявление делает код предсказуемым и предотвращает случайное использование. Кроме того, React.FC не поддерживает дженерики (например, React.FC<Props<T>>), что ограничивает типизацию. Поэтому современная практика - избегать React.FC и определять пропсы вручную.