如何获取react-native-ui-lib中UIDateTimePicker组件选中的日期输入值

UIDateTimePicker通过onChange回调属性返回用户选中的日期值，回调的入参为标准Date类型对象，你可以直接在回调中对该值做打印、存储、格式化等处理。

以下是完整的使用示例：

import React, { useState } from 'react';
import { View } from 'react-native';
import { UIDateTimePicker } from 'react-native-ui-lib';

const PickerDemo = () => {
  // 可选：用state存储选中值实现受控组件
  const [pickedDate, setPickedDate] = useState(new Date());

  const handlePick = (date) => {
    setPickedDate(date);
    // 打印选中日期到控制台
    console.log('选中的日期：', date);
    // 格式化打印示例
    console.log('格式化后：', date.toLocaleString('zh-CN'));
  };

  return (
    <View>
      <UIDateTimePicker
        value={pickedDate}
        onChange={handlePick}
        mode="date" // 可选值：date(仅日期)/time(仅时间)/datetime(日期+时间)
      />
    </View>
  );
};

export default PickerDemo;

注意事项 #

• 若组件mode设为time，返回的Date对象年月日默认取当前系统日期，仅时分秒为用户选中值
• 无需受控模式时可以省略value属性绑定，仅传onChange即可正常获取选中值
• 需自定义日期格式时，可以配合Day.js、Moment.js等时间库处理返回的Date对象

内容的提问来源于stack exchange，提问作者Lê Quốc Khánh