O'Reilly logo

React Native By Example by Richard Kho

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Picker

So far in this book, we have used DatePickerIOS and DatePickerAndroid for users to select dates. Each platform also has access to a native Picker component, where we can populate an array of choices and allow our users to interact with it.

Building a Picker is easy. We start by writing a Picker in the render method of a component and populate it with Picker.Item children:

<Picker>   <Picker.Item      label='Hello'     value='hello'   /> </Picker>  

Then, we can give the Picker some props. The following ones are used in this exercise:

  • onValueChange: This is a callback fired when an item has been selected. It passes two arguments: itemValue and itemPosition
  • selectedValue: This is a reference to the current value of the Picker list

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required