Блог

У меня есть компонент кнопки

 interface ButtonProps {
  className: string;
  content: string;
}

const Button = ({ className, content }): ButtonProps => {
  return <button className={className}>{content}</button>;
};

export default Button;
 

Я App.tsx импортирую его в следующем контексте

 import "./styles.scss";
import Button from "./button";

export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <Button className={"seeMore"} content={"See More"} />
    </div>
  );
}
 

Мой компонент кнопки выдает мне следующую ошибку

 Type 'Element' is missing the following properties from type 'ButtonProps': className, content
 

Почему я получаю эту ошибку и как я могу ее исправить?

Ссылка на Codesandbox

Вы используете ButtonProps неправильный способ. Просто обновите вот так:

 const Button = ({ className, content }: ButtonProps) => {
  return <button className={className}>{content}</button>;
};