reactjs - 如何创建具有 HTMLAttributes 作为道具的组件

Question

我正在使用 Typescript 和 Preact。我想创建一个组件来公开 a<span/>可以拥有的所有道具：

import { h, Component } from "preact";

export class MySpan extends Component<any, void> {
    render(props) {
        return <span {...props}></span>;

    }
}

但是，上面的示例使用了any，这并不是真正的类型安全。相反，我想公开属性span。

Answer 1

作为反应，我会这样做：

export class MySpan extends React.Component<React.HTMLProps<HTMLDivElement>, void>
{
    public render()
    {
        return <span {...this.props}/>;
    }
}

我没有真正的经验，preact但考虑到他们的preact.d.ts，它应该类似于：

import { h, Component } from "preact";

export class MySpan extends Component<JSX.HTMLAttributes, void> {
    render(props) {
        return <span {...props}></span>;

    }
}

请注意，这不是 span 元素的特定属性，而是通用属性。