探索React Native的datetimepicker：一款高效、灵活的日历时间选择器

import React, { useState } from 'react';
import { View, Text, Button, DatePickerAndroid, TimePickerAndroid } from 'react-native';
 
export default function DateTimePickerExample() {
  const [date, setDate] = useState(new Date());
 
  const showDatePicker = async () => {
    try {
      const { action, year, month, day } = await DatePickerAndroid.open({
        // 设置初始日期
        date: date
      });
      if (action === DatePickerAndroid.dateSetAction) {
        setDate(new Date(year, month, day));
      }
    } catch ({ code, message }) {
      console.warn('Cannot open date picker', message);
    }
  };
 
  const showTimePicker = async () => {
    try {
      const { action, hour, minute } = await TimePickerAndroid.open({
        // 设置初始时间
        hour: date.getHours(),
        minute: date.getMinutes(),
      });
      if (action === TimePickerAndroid.timeSetAction) {
        setDate(new Date(date.setHours(hour, minute)));
      }
    } catch ({ code, message }) {
      console.warn('Cannot open time picker', message);
    }
  };
 
  return (
    <View>
      <Button onPress={showDatePicker} title="选择日期" />
      <Button onPress={showTimePicker} title="选择时间" />
      <Text>{date.toISOString()}</Text>
    </View>
  );
}

这段代码展示了如何在React Native应用中使用DatePickerAndroid和TimePickerAndroid来选择日期和时间，并更新一个状态变量。这个例子简洁明了，并且使用了async/await来处理异步操作，使得代码更加易读和易于理解。