UNPKG

1.28 kBJavaScriptView Raw
1/**
2 * @prettier
3 * @flow
4 * */
5
6import React from 'react'
7import { requireNativeComponent, PickerIOS, Picker, Text } from 'react-native'
8
9type Props = {
10 data: Array<string>,
11 selectedItem?: number,
12 onItemSelected?: number => void
13}
14
15type State = {
16 selectedItem: number
17}
18
19export default class WheelPicker extends React.Component<Props, State> {
20 static defaultProps = {
21 style: {
22 width: 200,
23 height: 150,
24 },
25 }
26
27 constructor(props: Props){
28 super(props)
29 this.state = {
30 selectedItem: props.selectedItem
31 }
32 }
33
34 componentDidUpdate(prevProps: Props, prevState: State){
35 if (prevState.selectedItem !== this.props.selectedItem){
36 this.setState({ selectedItem: this.props.selectedItem })
37 }
38 }
39
40 onItemSelected = (value: any, index: number) => {
41 if (this.props.onItemSelected) {
42 this.props.onItemSelected(index)
43 }
44 this.setState({selectedItem: index})
45 }
46
47 render() {
48 const data = this.props.data
49 if (!data || !data.length < 0) return null
50 return (
51 <Picker
52 {...this.props}
53 selectedValue={data[this.state.selectedItem]}
54 onValueChange={this.onItemSelected}>
55 {this.props.data.map((i, index) => <Picker.Item key={index} label={i} value={i} />)}
56 </Picker>
57 )
58 }
59}