1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 | import React from 'react'
|
7 | import { requireNativeComponent, PickerIOS, Picker, Text } from 'react-native'
|
8 |
|
9 | type Props = {
|
10 | data: Array<string>,
|
11 | selectedItem?: number,
|
12 | onItemSelected?: number => void
|
13 | }
|
14 |
|
15 | type State = {
|
16 | selectedItem: number
|
17 | }
|
18 |
|
19 | export 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 | }
|