将状态从react-select <Select> (以函数形式)传递到父类

// 父组件
import React, { useState } from 'react';
import SelectComponent from './SelectComponent';

const ParentComponent = () => {
  const [selectedOption, setSelectedOption] = useState(null);

  // 回调函数，接收子组件的状态更新
  const handleSelectChange = (option) => {
    setSelectedOption(option);
  };

  return (
    <div>
      <SelectComponent onSelectChange={handleSelectChange} />
      <p>Selected Option: {selectedOption}</p>
    </div>
  );
};

export default ParentComponent;

// 子组件
import React, { useState } from 'react';
import Select from 'react-select';

const SelectComponent = ({ onSelectChange }) => {
  const [selectedOption, setSelectedOption] = useState(null);

  // 当状态发生变化时，调用回调函数将状态传递给父组件
  const handleChange = (option) => {
    setSelectedOption(option);
    onSelectChange(option);
  };

  return (
    <Select
      value={selectedOption}
      onChange={handleChange}
      options={...}
    />
  );
};

export default SelectComponent;