如何使用打字稿在可重用组件中导入html样式属性？

Posted 2023-02-23

【中文标题】如何使用打字稿在可重用组件中导入html样式属性？

【英文标题】：How to import html style attribute in a reusable component with typescript?

【发布时间】：2021-06-10 23:12:43

【问题描述】：

大家好，我想创建一个可重用的按钮组件。 OnClick 属性实现成功。但是样式属性不起作用。如何使样式功能像在 html 中一样工作？我应该在第 8 行写什么？

如您所见，我只是想让 MyComponent 的样式属性像 HTML 样式属性一样工作。

感谢您的帮助！

【参考方案1】：

像这样：

interface IButtonProps 
    color?: string;
    fontSize?: string | number;
    children?: React.ReactNode;
    onClick?: React.MouseEventHandler<HTMLElement>;
    style?: React.CSSProperties;

您试图从 IDE 工具提示中复制属性声明本身。当您将鼠标悬停在 jsx 元素的 style 属性上时，该表示法有点令人困惑，但 : 之后的是类型表示法。