用于在React组件中填充下拉框的多个API调用

import React, { useEffect, useState } from 'react';

const DropdownComponent = () => {
  const [options, setOptions] = useState([]);

  useEffect(() => {
    fetch('https://api.example.com/options')
      .then(response => response.json())
      .then(data => setOptions(data))
      .catch(error => console.log(error));
  }, []);

  const handleSelectChange = (event) => {
    const selectedOption = event.target.value;
    // 执行选择下拉框选项后的操作
  };

  return (
    <select onChange={handleSelectChange}>
      {options.map(option => (
        <option key={option.id} value={option.value}>{option.label}</option>
      ))}
    </select>
  );
};

export default DropdownComponent;