TypeScript

Hoe type je React components?

TypeScript in React.

Home/Categorieën/TypeScript/Hoe type je React components?

React typing

FC<Props> - functional component React.ReactNode - return type Event types: React.ChangeEvent

Code Voorbeelden

TYPESCRIPTReact TypeScript
import { FC } from 'react';

interface ButtonProps {
  label: string;
  onClick: () => void;
}

const Button: FC<ButtonProps> = ({ label, onClick }) => {
  return <button onClick={onClick}>{label}</button>;
};

// With events
interface InputProps {
  value: string;
  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
}

const Input: FC<InputProps> = ({ value, onChange }) => {
  return <input value={value} onChange={onChange} />;
};

Relevante trefwoorden

ReactFCTypeScript