react-intl-tel-input
react-intl-tel-input copied to clipboard
how to use it with react-hook-form
I am using react-hook-form now how i can get the country code as user change it ? there is any method available which trigger when the country changed ?
onSelectFlag
is what you want. Also in the documented props.
The docs right now don't list out all of the params of the onSelectFlag
callback, unfortunately (this needs to be improved upon), so keep this with you as a guide:
JavaScript
const handleSelectFlag = (currentNumber, seletedCountryData, fullNumber, isValid) => {
console.log(seletedCountryData.iso2);
};
TypeScript
type CountryData = {
/** Country name. */
name?: string;
/** ISO 3166-1 alpha-2 code. */
iso2?: string;
/** International dial code. */
dialCode?: string;
/** Order (if >1 country with same dial code). */
priority?: number;
/** Area codes (if >1 country with same dial code). */
areaCodes?: string[] | null;
};
const handleSelectFlag = (currentNumber: string, seletedCountryData: CountryData, fullNumber: string, isValid: boolean): void => {
console.log(seletedCountryData.iso2);
};
I wrote an example here just for this: https://github.com/andrewsantarin/react-intl-tel-input-with-react-hook-form/blob/master/src/hook-form-example/HookFormExample.tsx