界面扩展HTML属性<…>{}在Vite中无法正常工作

出现一个错误,即字段(props)“value”、“pattern”等对TextField组件不可见。

错误: 类型“{value:number;pattern:string;onChange:(e:ChangeEvent)=>void;}”不可分配给类型“IntrnsicAttributes&ITextField’。 类型'IntrinsicAttributes&上不存在属性'value';ITextField'

//TextField.tsx
import { FC, HTMLAttributes } from 'react';

interface ITextField extends HTMLAttributes<HTMLInputElement> {}

const TextField: FC<ITextField> = (props) => {
  return ( <input {...props} type='text' /> );
};
export default TextField;

//App.tsx
import { ChangeEvent, useState } from 'react';
import TextField from './components/TextField';

const App = () => {
  const [value, setValue] = useState<number>(0);

  const change = (e: ChangeEvent<HTMLInputElement>) => {
    /* ... */
  };

  return (
    <div className='App'>
      <TextField
        value={value}
        pattern='[0-9]*'
        onChange={(e: ChangeEvent<HTMLInputElement>) => change(e)}
      />
    </div>
  );
};
export default App;

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。