如何在react中验证小于开始日期的结束日期，如果react中的结束日期小于开始日期，如何在横幅中添加错误消息

import React, { useState } from 'react';

const DateValidationComponent = () => {
  const [startDate, setStartDate] = useState('');
  const [endDate, setEndDate] = useState('');
  const [errorMessage, setErrorMessage] = useState('');

  const handleStartDateChange = (event) => {
    setStartDate(event.target.value);
    validateDates(event.target.value, endDate);
  };

  const handleEndDateChange = (event) => {
    setEndDate(event.target.value);
    validateDates(startDate, event.target.value);
  };

  const validateDates = (start, end) => {
    if (start && end && end < start) {
      setErrorMessage('结束日期不能小于开始日期');
    } else {
      setErrorMessage('');
    }
  };

  return (
    <div>
      <label>开始日期:</label>
      <input type="date" value={startDate} onChange={handleStartDateChange} />

      <br />

      <label>结束日期:</label>
      <input type="date" value={endDate} onChange={handleEndDateChange} />

      {errorMessage && <div className="error">{errorMessage}</div>}
    </div>
  );
};

export default DateValidationComponent;