React TypeScript error for size attribute of html input element

0
votes

I am using create-react-app with the TypeScript template. When I write the following JSX/TSX code snippet

function MyInputFieldComponent() {
    return (
        <input type="text" size="100" placeholder="Full Name"/>
    );
}

I get the following compiler error:

(JSX attribute) React.InputHTMLAttributes.size?: number | undefined

Type 'string' is not assignable to type 'number | undefined'.ts(2322)

index.d.ts(2094, 9): The expected type comes from property 'size' which is declared here on type 'DetailedHTMLProps, HTMLInputElement>'

What is wrong here? Shouldn't I be able to set the html attribute "size" like any other attribute?

1
reactjstypescript
size is a number, not a string – wentjun

1 Answers

2
votes
function MyInputFieldComponent() {
    return (
        <input type="text" size={100} placeholder="Full Name"/>
    );
}