Select View Closes When Value Changes

[dioncodes]

Describe the bug
The select popup closes instantly when the state and selected value changes. If the value isn't changed, it will jump back to the specified option of the value property .

To Reproduce
Steps to reproduce the behavior:

1. Tap select
2. Scroll to a different option (iOS)
3. Select View disappears

Expected behavior
Select View should stay present until it is closed or "done" is tapped.

Screenshots
n/a

Additional details

• Device: Simulator (iPhone 11, 12 Pro, etc.)
• OS: iOS 14.3
• react-native-picker-select version: 8.0.4
• react-native version: 0.63.4
• expo sdk version: n/a

Reproduction and/or code sample

<RNPickerSelect
	onValueChange={(value: number) => {
		setSelectedValue(value);
	}}
	items={[
		{ label: 'Test A', value: 0 },
		{ label: 'Test B', value: 1 },
		{ label: 'Test C', value: 2 },
	]}
	value={selectedValue}
/>

[lfkwtz]

fill out full bug report

[radabo]

I have same problem :-(

[dioncodes]

fill out full bug report

What do you mean? I filled out the github issue bug template.

[lfkwtz]

additional details aren't filled out

[dioncodes]

additional details aren't filled out

Sorry, I've added the missing version numbers of the additional details above.

[dbazian]

Same problem here

[EmmanuelSkapple]

Same problem to :/

[dioncodes]

I managed to find a temporary workaround until this is fixed:

• Remove the value prop from the <RNPickerSelect />
• Use a ref (<RNPickerSelect ref={picker} ... />) and set the initial value (using setState) at the beginning:

const picker = useRef<RNPickerSelect>(null);

useEffect(() => {
  picker.current?.setState({ selectedItem: { label: 'Example B', value: 1 } });
}, []);

Please note that the full item (including label) needs to be passed, not only the value.