Need the ability to show placeholder when default country is selected but number input is empty

[WaqqarSuleman]

Hi,

I have a requirement where I need the ability to show placeholder when default country is selected but number input is empty. Any help would be appreciated.

[MartinDesrosiers]

Hi @WaqqarSuleman, Did you find a solution for this issue? I'm facing the same problem. Thanks!

[WaqqarSuleman]

Hi @WaqqarSuleman, Did you find a solution for this issue? I'm facing the same problem. Thanks!

Nope.

[instakash]

Same problem here. I cannot show the placeholder either.

[xtrinch]

Bump. Same here.

[groteck]

Bump

[XxOsirisxX]

+1

[hipdev]

Hi folks, try this:

  const [value, setValue]= useState('')
  // ...

  useEffect(() => {
    // tricky way of set as empty the phoneInput with a country code selected

    let timer = setTimeout(() => setValue('1'), 100)  // or whatever state you have, Formik, RHF...
    let timer2 = setTimeout(() => setValue(''), 200)
    return () => {
      clearTimeout(timer)
      clearTimeout(timer2)
    }
  }, [])

  // ... add value to your PhoneInput component like always...

Voilà, it works 😉