React-native-picker-select: Invariant Violation: Tried to register two views with the same name AndroidDropdownPicker

[plgrazon]

Describe the bug

Invariant Violation: Tried to register two views with the same name AndroidDropdownPicker, js engine: hermes

To Reproduce

Steps to reproduce the behavior:

Not a new project and started it using the normal process

1. Update react-native-picker-select to 8.0.1
2. rm -rf node_modules && rm package-lock.json && npm install
3. react-native start --reset-cache

Expected behavior

To behave like the 7.0.0 version

Screenshots

Add screenshots to help explain your problem. If screenshots aren't applicable to this issue, write "n/a".

Additional details

• Device: Samsung A10e
• OS: Android 10
• react-native-picker-select version: 8.0.1
• react-native version: 0.62.2
• expo sdk version: n/a

Reproduction and/or code sample

const AppNativePicker = ({
  label,
  type,
  value,
  setStateAttribute,
  items,
  containerStyle = {},
}) => {
  const isWideDropDown = label !== 'Age';

  return (
    <RNPickerSelect
      value={value}
      onValueChange={choice => setStateAttribute(type, choice)}
      useNativeAndroidPickerStyle={false}
      onUpArrow={() => {}}
      onDownArrow={() => {}}
      placeholder={{ label }}
      Icon={() => (
        <VectorIcon iconFamily="Feather" name="chevron-down" color="#818e9c" size={scale(24)} />
      )}
      style={{
        placeholder: styles.placeholderStyle,
        modalViewMiddle: styles.modalViewMiddle,
        modalViewBottom: styles.modalViewBottom,
        iconContainer: isWideDropDown ? styles.iconContainerWide : styles.iconContainerNarrow,
        inputIOS: styles.inputIOS,
        inputIOSContainer: {
          ...styles.inputStyle,
          ...containerStyle,
        },
        inputAndroid: {
          ...styles.inputStyle,
          ...containerStyle,
        },
      }}
      items={items}
    />
  );
};

[danjocha]

+1

[plgrazon]

+1

Hi solved it by forking it. Updated the package's react-native-community/picker to 1.8.0

https://github.com/plgrazon/react-native-picker-select

[sjungwirth]

I had same issue; this is caused by a second instance/version of react-native-community/picker (check yarn.lock)

v8.0.1 of react-native-picker-select has pinned version of react-native-community/picker and other modules might not, so we end up with two different versions of react-native-community/picker installed which causes the error.

solution for me was to pin react-native-picker-select version to 8.0.0

---

[edit]
maybe a better way to solve this is to add a "resolutions" field to your package json, and then yarn won't install multiple versions of react-native-community/picker: https://classic.yarnpkg.com/en/docs/selective-version-resolutions/.

"resolutions": {
    "@react-native-community/picker": "^1.6.5"
  }

[hengkx]

how to resolve?

[plgrazon]

how to resolve?

Hi @hengkx I resolved this by having the community picker version on our app and this module the same.

So basically I forked the repo, updated the community picker that they have.

[bittu1028]

can we open this again not working with the latest version 8.0.2 ?

[jlpinzonr]

yes pelase, not working yet

[Jose-Bustamante]

The temporary solution suggested by @sjungwirth worked well. Please re-open this issue to provide a solution. Thanks.
"react-native-picker-select": "8.0.0",
"@react-native-community/picker": "^1.8.1",
Those two together work just fine for me.

[erikaperugachi]

I know the mistake, when you use the version react-native-picker-select@^8.0.2, the version of @react-native-community/picker is 1.6 (without this), defined it by its package.json. If we add install the version 1.8 of @react-native-community/picker only works in this moment. Because if your other member team download the repo and install again the project this doesn't works. They have to install again the 1.8 of @react-native-community/picker to work again.

The solution is: in this repo in this package.json should be the version of @react-native-community/picker is ^1.6 or 1.8.1

[BIRahul]

with version 8.0.0 it is start working fine. thanks guys.

[nandorojo]

The temporary solution suggested by @sjungwirth worked well. Please re-open this issue to provide a solution. Thanks.
"react-native-picker-select": "8.0.0",
"@react-native-community/picker": "^1.8.1",
Those two together work just fine for me.

@react-native-community/picker support was removed in Expo SDK 40. Is there a way to get this to work with @react-native-picker/picker?