如何使用另一个下拉列表过滤下拉列表的选项

from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route('/api/get_options')
def get_options():
    # 从数据库或其他数据源获取选项数据
    options = [
        {'id': 1, 'label': '选项1', 'selected': False},
        {'id': 2, 'label': '选项2', 'selected': False},
        {'id': 3, 'label': '选项3', 'selected': False},
    ]
    return jsonify(options)

@app.route('/api/select_option')
def select_option():
    # 获取用户选择的选项ID
    option_id = request.args.get('option_id')
    # 根据选项ID查询选项文本
    option = options[option_id - 1]
    return jsonify({'selected_option': option['label']})

if __name__ == '__main__':
    app.run()

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

function App() {
    const [options, setOptions] = useState([]);

    useEffect(() => {
        const fetchData = async () => {
            const response = await fetch('/api/get_options');
            const options = await response.json();
            setOptions(options);
        };
        fetchData();
    }, []);

    const handleOptionSelect = (option_id) => {
        // 将用户选择的选项ID发送给服务端
        fetch('/api/select_option', {
            method: 'POST',
            body: JSON.stringify({ option_id }),
        });
    };

    return (
        <div>
            <select>
                {options.map((option) => (
                    <option key={option.id} value={option.id}>
                        {option.label}
                    </option>
                ))}
            </select>
            <button onClick={() => handleOptionSelect(1)}>选择选项1</button>
            <button onClick={() => handleOptionSelect(2)}>选择选项2</button>
        </div>
    );
}

export default App;