Components 7 exercises

Typing Event Handlers

Here we have our Button component with a className and some children on it, as well as an onClick.

interface ButtonProps {
className: string;
children: React.ReactNode;
export const Button = ({ children, className, onClick }: ButtonProps) => {
return (
<button o

Loading exercise


0:00 In this exercise, we have a component called "button." This button has an onClick property here, and we want this to exactly match the onClick property that's found on this button here, on the native button.

0:13 Your challenge is to try to work out what we can type this as and how we can add onClick to the props here in a way that makes sense and will match the type that button expects. Good luck.