React选择dropdown onChange filter并重置为上一个/原始状态？

import React, { useState } from 'react';

const DropdownFilter = () => {
  const [selectedValue, setSelectedValue] = useState('');
  const [filteredData, setFilteredData] = useState([]);

  // 其他组件代码...

  return (
    <div>
      {/* dropdown选择器 */}
      <select value={selectedValue} onChange={handleDropdownChange}>
        <option value="">请选择</option>
        <option value="option1">选项1</option>
        <option value="option2">选项2</option>
        <option value="option3">选项3</option>
      </select>

      {/* 显示过滤后的数据 */}
      <ul>
        {filteredData.map(item => (
          <li key={item.id}>{item.name}</li>
        ))}
      </ul>

      {/* 其他组件代码... */}
    </div>
  );
};

export default DropdownFilter;

const handleDropdownChange = event => {
  const selectedOption = event.target.value;

  // 根据选择的值过滤数据并更新状态
  const filtered = data.filter(item => item.category === selectedOption);

  setSelectedValue(selectedOption);
  setFilteredData(filtered);
};

const [selectedValue, setSelectedValue] = useState('');
const [filteredData, setFilteredData] = useState([]);
const [previousValue, setPreviousValue] = useState('');

const handleDropdownChange = event => {
  const selectedOption = event.target.value;

  if (selectedOption === previousValue) {
    // 重置为原始状态
    setSelectedValue('');
    setFilteredData([]);
    setPreviousValue('');
  } else {
    // 过滤数据并更新状态
    const filtered = data.filter(item => item.category === selectedOption);
  
    setSelectedValue(selectedOption);
    setFilteredData(filtered);
    setPreviousValue(selectedOption);
  }
};