xcarpentier / react-native-country-picker-modal

🇦🇶 Country picker provides a modal allowing a user to select a country from a list. It display a flag next to each country name.
https://reactnative.gallery/xcarpentier/country-picker
MIT License
1.08k stars 802 forks source link

preferredCountries prop is not working as expected #384

Closed viv-eak closed 3 years ago

viv-eak commented 3 years ago

Issue Description

I want to use preferredCountries prop but it is not working.

Steps to Reproduce / Code Snippets

<CountryPicker theme={dark ? DARK_THEME : {}} {...{ countryCode, withFilter, withFlag, withCallingCodeButton, withAlphaFilter: false, withCallingCode, onSelect, preferredCountries: ['US'], modalProps: { visible, }, onClose: () => setVisible(false), onOpen: () => setVisible(true), containerButtonStyle: { paddingVertical: 0, }, }} />

Expected Results

It should add Us at the top.

Additional Information

michaelVictoriaDev commented 3 years ago

still having the same issue.

michaelVictoriaDev commented 3 years ago

as per docs preferredCountries: CountryCode preferred countries they appear first (withAlphaFilter must be false) :(

jhta commented 3 years ago

same issue

Pauligrinder commented 3 years ago

I noticed the same thing. The prop works, but it doesn't update after the component has been mounted. A bit of a hacky solution is to add the prop key with something like key={'countryPicker-'+countryCode} (or whatever is being added to preferedCountries), which forces the component to re-render whenever said value updates. I'm using that to show the chosen country at the top :)

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.