search

lawnstarter / react-native-picker-select

🔽 A Picker component for React Native which emulates the native <select> interfaces for iOS and Android
https://npmjs.com/package/react-native-picker-select
MIT License
1.74k stars 497 forks source link

Element type is invalid: expected a string but got undefined #479

Closed anchetaWern closed 2 years ago

anchetaWern commented 2 years ago

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

  1. Install package: npm install @react-native-picker/picker
  2. Install native dependency: npx pod-install
  3. Add sample code:
import RNPickerSelect from '@react-native-picker/picker';

<RNPickerSelect
  onValueChange={value => console.log(value)}
  items={[
    {label: 'Football', value: 'football'},
    {label: 'Baseball', value: 'baseball'},
    {label: 'Hockey', value: 'hockey'},
  ]}
/>

Expected behavior
It should work.

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

Screen Shot 2022-04-23 at 3 05 26 PM

Additional details

Reproduction and/or code sample
Provide a link to a reproduction of this issue on https://snack.expo.io or an explanation why you can not. Not including a snack link will result in a significant delay in our ability to address this issue.

import RNPickerSelect from '@react-native-picker/picker';

<RNPickerSelect
  onValueChange={value => console.log(value)}
  items={[
    {label: 'Football', value: 'football'},
    {label: 'Baseball', value: 'baseball'},
    {label: 'Hockey', value: 'hockey'},
  ]}
/>

I can't because the sample code in the existing expo uses the non-react native package in the example: https://snack.expo.dev/@lfkwtz/react-native-picker-select

Docs said to install this package for React Native: @react-native-picker/picker But the sample Snack is using this package: react-native-picker-select which doesn't work when I tried. Installing them both causes a conflict in the naming.

anchetaWern commented 2 years ago

Works now. There's been a mix up with the existing packages I'm using. Basically I just needed to install both react-native-picker-select and the dependency which is @react-native-picker/picker

projeffboy commented 1 year ago

Thanks, the documentation should be a little clearer, I thought I only had to install @react-native-picker/picker. Since I have react 18, I had to legacy peer deps install and it told me to install react-native-gesture-handler and react-native-safe-area-context