Как передать интерфейс (типизацию) в React-компонент?

Question

[herasko-sg]

Как передать интерфейс (типизацию) в React-компонент?

Comments

[Дмитрий Беляев]

а можете привести пример, что Вы пытаетесь сделать?

Answer 1

[Alexandroppolus]

Компонент определяется своими пропсами. Обычно делают так (типы взяты для примера):

// пропсы
type MyCompProps = {
  value: string;
  ...
};

// для компонента указывается тип - "функциональный компонент с пропсами MyCompProps"
// далее не нужно указывать тип для props и тип возвращаемого значения - TS выводит сам.
export const MyComp: React.FC<MyCompProps> = (props) => {
  ...
  return (<div>{props.value}</div>);
};

Comments

[herasko-sg]

Я хочу не объявлять типы в нутри компонента, а как бы передать через пропсы в его.