在react中将字符串更改为select列表

import React, { Component } from 'react';

class SelectComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedOption: '',
    };
  }

  handleChange = (event) => {
    this.setState({ selectedOption: event.target.value });
  }

  render() {
    const { selectedOption } = this.state;
    const { options } = this.props;

    return (
      <select value={selectedOption} onChange={this.handleChange}>
        {options.map((option, index) => (
          <option key={index} value={option}>{option}</option>
        ))}
      </select>
    );
  }
}

export default SelectComponent;

import React from 'react';
import SelectComponent from './SelectComponent';

const options = ['Option 1', 'Option 2', 'Option 3'];

function App() {
  return (
    <div>
      <SelectComponent options={options} />
    </div>
  );
}

export default App;