diff --git a/lib/index.js b/lib/index.js index 75630fd9..e474275d 100644 --- a/lib/index.js +++ b/lib/index.js @@ -33,8 +33,7 @@ export default class PhoneInput extends Component { iso2: initialCountry, disabled, formattedNumber: countryData ? `+${countryData.dialCode}` : "", - value: null, - inputValue: "", + value: null }; } @@ -118,13 +117,17 @@ export default class PhoneInput extends Component { if (this.state.iso2 !== iso2) { const countryData = PhoneNumber.getCountryDataByCode(iso2); if (countryData) { + const newPhoneNumber = this.state.formattedNumber.replace( + PhoneNumber.getDialCode(this.state.formattedNumber), + `+${countryData.dialCode}` + ) this.setState( { iso2, - formattedNumber: `+${countryData.dialCode}` + formattedNumber: newPhoneNumber }, () => { - this.updateFlagAndFormatNumber(this.state.inputValue) + this.updateFlagAndFormatNumber(newPhoneNumber) if (this.props.onSelectCountry) this.props.onSelectCountry(iso2); } ); @@ -133,7 +136,7 @@ export default class PhoneInput extends Component { } isValidNumber() { - if (this.state.inputValue.length < 3) return false; + if (this.state.formattedNumber.length < 3) return false; return PhoneNumber.isValidNumber( this.state.formattedNumber, this.state.iso2 @@ -151,16 +154,17 @@ export default class PhoneInput extends Component { let iso2 = this.getISOCode() || initialCountry; let formattedPhoneNumber = number; if (number) { - const countryCode = this.getCountryCode(); - if (formattedPhoneNumber[0] !== "+" && countryCode !== null) { - formattedPhoneNumber = '+' + countryCode.toString() + formattedPhoneNumber.toString(); - } formattedPhoneNumber = allowZeroAfterCountryCode ? formattedPhoneNumber : this.possiblyEliminateZeroAfterCountryCode(formattedPhoneNumber); iso2 = PhoneNumber.getCountryCodeOfNumber(formattedPhoneNumber); + + if( formattedPhoneNumber.includes(this.state.formattedNumber)){ + formattedPhoneNumber = this.format(formattedPhoneNumber) + } } - this.setState({ iso2, formattedNumber: formattedPhoneNumber, inputValue: number }, actionAfterSetState); + + this.setState({ iso2, formattedNumber: formattedPhoneNumber }, actionAfterSetState); } possiblyEliminateZeroAfterCountryCode(number) { @@ -179,7 +183,7 @@ export default class PhoneInput extends Component { } render() { - const { iso2, inputValue, disabled } = this.state; + const { iso2, formattedNumber, disabled } = this.state; const TextComponent = this.props.textComponent || TextInput; return ( @@ -206,7 +210,7 @@ export default class PhoneInput extends Component { }} keyboardType="phone-pad" underlineColorAndroid="rgba(0,0,0,0)" - value={inputValue} + value={formattedNumber} {...this.props.textProps} />