React Native Picker
React Native Picker is component that is used to select an item from the multiple choices. This is the same as a Dropdown option. Picker is used when we need to provide an alternative to choose from multiple options.
It is used by importing the Picker component from the react-native library.
Props of Picker
|onValueChange( itemValue, itemPosition)
||It is a callback prop, called when an item is selected. It takes two parameters (itemValue: then item value which is selected, itemPosition: the position (index) of a selected item).
||Returns the selected value.
||It is a picket style type.
||It is used to locate this view in end-to-end tests.
||A Boolean prop makes picker disable when set to false. If it is set to false, the user cannot be able to make a selection.
||On Android, it specifies how to display the selections items when the users click on the picker. It has the dialog and dropdown properties. The dialog is default mode and shows as a modal dialog. The dropdown displays the picker as dropdown anchor view.
||It is used in Android with dialog mode as the title of the dialog.
||It styles each item of the picker labels.
React Native Picker Example
In this example, we create three label items in Picker component. When selecting an item from Picker, it calls the onValueChange callback and set the selected item in the picker, and item index is read from itemPosition. The item's position is displayed in a Text component.