Ho do I get rid of this error in react js

Question

<Input
    {...register('maxVisit', {
    required: '⚠ This input is required.',
     })}
     name='maxVisit'
     id='maxVisit'
     type='number'
     placeholder={selectedOffer?.maxVisits}//error here 
   />

No overload matches this call. Overload 1 of 2, '(props: InputProps | Readonly): Input', gave the following error. Type 'number | undefined' is not assignable to type 'string | undefined'. Type 'number' is not assignable to type 'string | undefined'. Overload 2 of 2, '(props: InputProps, context: any): Input', gave the following error. Type 'number | undefined' is not assignable to type 'string | undefined'.

Answer 1

The TS error is that you are trying to pass a value of type number but placeholder prop only accept string values so you need to convert value of type number to string , before passing any value to a component ,

TIP:If you are using VS code , hover on the prop it will show you what data type it accepts you can pass it accordingly

<Input
    {...register('maxVisit', {
    required: '⚠ This input is required.',
     })}
     name='maxVisit'
     id='maxVisit'
     type='number'
     placeholder={String(selectedOffer?.maxVisits)}/
   />

Answer 2

Try matching propTypes. There might be a chance you are assigning number to string type where you possibly defined your interface/propType for placeholder.

If you need number then change string|undefined to number|undefined. If you need string then use like this String(selectedOffer?.maxVisits) in placeholder.