React Native DatePicker使用报错：需指定value prop对应日期/时间

核心错误原因 #

1. 组件属性不匹配：你使用的DatePicker组件（推测是@react-native-community/datetimepicker）要求通过value属性传入日期值，但你的代码里用了date={date}，组件无法识别该属性，导致触发“必须指定日期或时间作为value prop”的渲染错误。
2. 回调函数参数错误：changeDate函数中引用了event变量，但函数定义的参数是selectDate，这会导致event未定义，进而影响日期更新的逻辑判断。

具体修正步骤 #

1. 修正组件属性 #

将date属性替换为value，如果是日期选择模式，还需添加mode="date"属性明确选择类型：

<DatePicker
  format="DD/MM/YYYY" // 注意修正为4个Y，原代码3个Y会导致年份格式错误
  value={date}
  mode="date"
  onDateChange={changeDate}
/>

2. 修复日期变更函数 #

根据@react-native-community/datetimepicker的回调规范，onDateChange会返回两个参数：event对象和选中的selectedDate，调整函数逻辑如下：

const [date, setDate] = useState(new Date());

function changeDate(event, selectDate) {
  if (event.type === 'dismissed') {
    return; // 取消选择时保持原日期
  }
  // 确保选中日期不为空时再更新
  setDate(selectDate || date);
}

额外注意事项 #

• 确认你安装的DatePicker包是@react-native-community/datetimepicker，如果是其他第三方包（如react-native-datepicker），属性规则可能不同，需要对应调整。
• 原代码中的format="DD/MM/YYY"存在年份格式错误，改为DD/MM/YYYY才能正确显示四位年份。

内容的提问来源于stack exchange，提问作者Weslley Henrique