如何使用react窗体挂钩验证react日期选择器

import React, { useState } from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';

const [selectedDate, setSelectedDate] = useState(null);
const [isValid, setIsValid] = useState(true);

const handleDateChange = (date) => {
  setSelectedDate(date);
};

<DatePicker
  selected={selectedDate}
  onChange={handleDateChange}
  dateFormat="yyyy-MM-dd"
/>

const handleSubmit = (e) => {
  e.preventDefault();

  if (selectedDate === null) {
    setIsValid(false);
  } else {
    // 执行其他表单提交操作
  }
};

<form onSubmit={handleSubmit}>
  <DatePicker
    selected={selectedDate}
    onChange={handleDateChange}
    dateFormat="yyyy-MM-dd"
  />
  {!isValid && <p>请选择一个有效的日期</p>}
  <button type="submit">提交</button>
</form>