类型"元素"缺少类型"ButtonProps"中的以下属性：类名，内容

Question

我有一个按钮组件

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联系

Answer 1

您使用ButtonProps的方式错误。就像这样更新:

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