月份范围筛选器react

import React, { useState } from 'react';

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

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

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

  return (
    <div>
      <label>Start Month: </label>
      <input type="month" value={startDate} onChange={handleStartDateChange} />
      <label>End Month: </label>
      <input type="month" value={endDate} onChange={handleEndDateChange} />
      <button onClick={() => console.log(`Selected range: ${startDate} to ${endDate}`)}>Apply Filter</button>
    </div>
  );
};

export default MonthRangeFilter;