Neverending Plethora of Modules
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

react-native-universal-picker

1.1.0 • Public • Published

react-native-universal-picker

npm version

Build Status

Cross platform component that uses React Native's Picker on Android and ActionSheetIOS on iOS. TypeScript type definitions available.

Installation

yarn add react-native-universal-picker

Or, if you prefer using npm:

npm i -S react-native-universal-picker

How to use

It exposes the same API as React Native's Picker.

import React, { PureComponent } from 'react';
import { View } from 'react-native';
import Picker from 'react-native-universal-picker';
 
export default class Example extends PureComponent {
  state = {
    language: 'js',
  };
 
  onValueChange = (itemValue, itemIndex) => {
    this.setState({
      language: itemValue,
    });
  }
 
  render() {
    return (
      <View style={{ backgroundColor: '#FFF' }}>
        <Picker
          selectedValue={this.state.language}
          onValueChange={this.onValueChange}
        >
          <Picker.Item
            label="Java"
            value="java"
          />
          <Picker.Item
            label="JavaScript"
            value="js"
          />
        </Picker>
      </View>
    )
  }
}

Available Props

Note that you can also use every prop from React Native's Picker. Check the TypeScript type definition file for further info.

Prop Type Default Description
cancelLabel string 'Cancel' The label of the latest ActionSheetIOS option button, which is the one that dismisses the picker on iOS

Issues

At the moment it's been manually tested only on Android.

Contributing

PRs are obviously welcome! :octocat:

License

MIT

Keywords

none

install

npm i react-native-universal-picker

Downloadsweekly downloads

8

version

1.1.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability