ReactJS:如何从子组件的下拉列表中获取选择/状态？

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

function ParentComponent() {
  const [selectedOption, setSelectedOption] = useState('');

  const handleOptionChange = (option) => {
    setSelectedOption(option);
  };

  return (
    <div>
      <ChildComponent onOptionChange={handleOptionChange} />
      <p>选择的选项：{selectedOption}</p>
    </div>
  );
}

// 子组件
import React from 'react';

function ChildComponent({ onOptionChange }) {
  const handleSelectChange = (event) => {
    const selectedOption = event.target.value;
    onOptionChange(selectedOption);
  };

  return (
    <select onChange={handleSelectChange}>
      <option value="option1">选项1</option>
      <option value="option2">选项2</option>
      <option value="option3">选项3</option>
    </select>
  );
}