React Native : DatePickerAndroid는 어떻게 구현합니까?

Question

RN 문서에 따르면 Android 날짜 선택기를 열려면 비동기/대기 함수를 호출해야합니다. 나는 바벨 사전 설정을 변환 발전기에 비동기를 설치하고

{ "plugins": ["transform-async-to-generator"] }

와 .babelrc 파일을 추가하지만, 태그 (예 : < 이미지를 사용하는 RN 구성 요소를 추가 할 때 그것은 단지 예기치 않은 토큰 오류가 발생하는 것 같습니다 시도했습니다. .. /> 던져서 예기치 않은 토큰 오류). 내 안드로이드 데이트 피커를 여는 기능은 다음과 같습니다.

async openAndroidDatePicker: function() { 
    try { 
    const {action, year, month, day} = await DatePickerAndroid.open({ 
     date: new Date() 
    }); 
    } catch ({code, message}) { 
    console.warn('Cannot open date picker', message); 
    } 
} 

Answer 1

을 해결합니다.

async openAndroidDatePicker() { 
    try { 
    const {action, year, month, day} = await DatePickerAndroid.open({ 
     date: new Date() 
    }); 
    } catch ({code, message}) { 
    console.warn('Cannot open date picker', message); 
    } 
} 

내가이 예, ES6하지 클래스 createClass을 사용했다 유의 사항 : 내 함수의 구문이 나를 위해 일 것입니다 ... 잘못이었다.

Answer 2

내 앱에서 날짜 선택기 안드로이드 용 라이브러리를 사용했습니다. 샘플 사용에 대한 :

'use-strict'; 

import React, {Component} from 'react' 
import{ 
    StyleSheet, 
    View, 
    Text, 
    Image, 
    TextInput, 
    Dimensions, 

}from 'react-native'; 

import DatePicker from 'react-native-datepicker'; 
var {width,height} = Dimensions.get('window'); 

class Booking extends Component{ 

    constructor(props) { 
    super(props); 
    this.state = { 

    date_in: '2016-05-01', 
    date_out: '2016-05-01', 

}; 
} 

render(){ 

return(
    <View> 

    <Text style={{fontSize:18, marginLeft:10, marginTop:10}}>Arrival/Departure:</Text> 

    <DatePicker 
     style ={{padding:10}} 
     date={this.state.date_in} 
     mode="date" 
     format="YYYY-MM-DD" 
     minDate="2016-05-01" 
     maxDate="2016-06-01" 
     showIcon={false} 
     customStyles={{ 
     dateInput: { 
      alignItems : 'flex-start', 
      padding:5 
     }, 
    }} 
    onDateChange={(date_in) => {this.setState({date_in: date_in});}}/> 

    </View> 
); 
} 
} 


var styles = StyleSheet.create({ 

    picker: { 
    width: 100, 
    }, 
}); 

module.exports = Booking; 

자세한 내용은 여기에서 찾아보실 수 있습니다 :

Date picker react native

희망이 당신을 도와줍니다 :