主页 / 问题 / 1214100
Accepted
xydope
Asked:2021-12-04 23:23:12 +0000 UTC2021-12-04 23:23:12 +0000 UTC

HTML 输入元素扩展

  • 772

我正在制作一个简单地扩展普通 html 输入的组件。

const Input: React.FC<HTMLAttributes<HTMLInputElement>> = (...props }) => <input {...props}} />

逻辑很简单，我采用通常的 html 输入，制作一个组件并传递道具。一般来说，所有的 props 都是正常滚动的（placeholder、value、onChange、className 等），但是 props 有问题type。

尝试将类型分配给组件<Input type="text" />时，会发生以下错误：

Type '{ type: string; }' is not assignable to type 'IntrinsicAttributes & HTMLAttributes<HTMLInputElement> & { children?: ReactNode; }'.
  Property 'type' does not exist on type 'IntrinsicAttributes & HTMLAttributes<HTMLInputElement> & { children?: ReactNode; }'.

一般来说，我做错了什么，但我不明白到底是什么。

reactjs

1 个回答

  1. Best Answer

    发现了一个错误，也许它会帮助某人。

    不应使用扩展名HTMLAttributes，但InputHTMLAttributes 结果是：

    const Input: React.FC<InputHTMLAttributes<HTMLInputElement>> = (...props }) => <input {...props}} />

    或者，如果通过自己的接口进行扩展

    interface ICustom extends InputHTMLAttributes<HTMLInputElement> {
myProp: any
}

const Input: React.FC<ICustom> = (myProps, ...props }) => <input {...props}} />
    • 0

相关问题