当我从第一个compbox中选择一个值时，其余compbox的值将发生更改

import React, { useState } from 'react';

const ComboBox = ({ options, onChange }) => (
  <select onChange={onChange}>
    {options.map(option => (
      <option key={option.value} value={option.value}>
        {option.label}
      </option>
    ))}
  </select>
);

const App = () => {
  const [selectedValue, setSelectedValue] = useState('');
  const [options, setOptions] = useState([
    { value: 'option1', label: 'Option 1' },
    { value: 'option2', label: 'Option 2' },
    { value: 'option3', label: 'Option 3' }
  ]);

  const handleFirstComboBoxChange = (event) => {
    const selected = event.target.value;
    setSelectedValue(selected);
    // 根据选择的值更新其他ComboBox的选项
    if (selected === 'option1') {
      setOptions([
        { value: 'subOption1', label: 'Sub Option 1' },
        { value: 'subOption2', label: 'Sub Option 2' }
      ]);
    } else if (selected === 'option2') {
      setOptions([
        { value: 'subOption3', label: 'Sub Option 3' },
        { value: 'subOption4', label: 'Sub Option 4' }
      ]);
    } else {
      setOptions([
        { value: 'option1', label: 'Option 1' },
        { value: 'option2', label: 'Option 2' },
        { value: 'option3', label: 'Option 3' }
      ]);
    }
  };

  return (
    <div>
      <ComboBox options={options} onChange={handleFirstComboBoxChange} />
      <ComboBox options={options} />
      <ComboBox options={options} />
    </div>
  );
};

export default App;