type ButtonProps = {
variant?: "primary" | "ghost";
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
children: React.ReactNode;
} & React.ComponentProps<"button">;
function Button({ variant = "primary", ...rest }: ButtonProps) {
return <button className={variant} {...rest} />;
}
const [user, setUser] = useState<User | null>(null);Что важно знать
- Props — через
typeилиinterface;React.FCне обязателен. React.ReactNodeдляchildren,React.ComponentProps<"input">— унаследовать атрибуты нативного элемента.- Состояние, которое начинается с
null, — явный тип вuseState. - Типы событий:
React.ChangeEvent<HTMLInputElement>,React.FormEvent. - Контекст без значения по умолчанию — свой хук с проверкой, что провайдер есть.
- Дженерик-компоненты:
function List<T>({ items, render }: …).