Question

我试图使用React Native＆＃39; s DatePickerAndroid。但我想在组件的初始加载时显示它。但问题是DatePickerAndroid是promise（see docs），我无法在初始渲染时加载它。

因此，我所拥有的是：

render(){
    let datePicker = <DatePickerIOS date={this.state.selectedValue} mode="date" timeZoneOffsetInMinutes={this.state.timeZoneOffsetInHours * 60} onDateChange={(date) => { this.setState({selectedValue: date})}} />;
    if (Platform.OS === "android"){
         datePicker = this.showAndroidDatePicker()
    } 

    return(
       <View>          
          {datePicker}
       </View>
    )
}

showAndroidDatePicker函数的位置与文档中的相同：

showAndroidDatePicker = async () => {
    try {
        const {action, year, month, day} = await DatePickerAndroid.open({
           date: this.state.selectedValue
        });
        if (action !== DatePickerAndroid.dismissedAction) {
           var date = new Date(year, month, day);
           this.setState({selectedValue: date.toLocaleDateString()});
        }
    }catch ({code, message}) {
        console.warn('Cannot open date picker', message);
    }
};

但是当我在android上运行时，我出现了一个错误的红色大屏幕：

对象作为React Child无效（找到：带键的对象（{_ 45， _81，_64，_54}）。 ......

知道如何处理吗？

Answer 1

您有效地尝试渲染open的结果，根据文档告诉您用户选择了什么。所以你可能不想渲染它或在渲染函数中的任何地方使用它。

添加按钮以打开日期选择器，按下时调用open方法。结果将告诉您用户选择了什么。

如何在React Native组件的初始加载时呈现promise

1 个答案: