react-phone-input-2 icon indicating copy to clipboard operation
react-phone-input-2 copied to clipboard

Default value not loading on initial page load

Open gyannickange opened this issue 4 months ago • 0 comments

Description:

I am encountering an issue where the default value of the PhoneInput component is not displayed when the page is initially loaded. The component does not recognize the default value on the first render.

Steps to Reproduce:

  1. Set a default value for the PhoneInput using the value prop.
  2. Load the page and observe that the default value is not displayed in the input field.

Expected Behavior:

The PhoneInput should display the default value when the page is first loaded.

Actual Behavior:

The input field remains empty on the initial load, but the value appears after the hot reload.

Code Example:

<PhoneInput
  country="bj"
  value="+22996669509"  // Default phone number
  countryCodeEditable={false}
/>

Environment:

react-phone-input-2 version: ^2.15.1 React version: ^18.3.1

Additional Information:

I've tried multiple ways to set the default value, including using useState, but the behavior is consistent across approaches. It seems related to how the component initializes the value on the first render.

gyannickange avatar Oct 03 '24 08:10 gyannickange