reactjs - 获取功能组件中select onChange的值

Question

我在一个功能组件中有一个选择，当我选择一个选项时我无法获得值。我只能为基于类的组件找到解决方案。我以为 useState 可以解决问题，但我遗漏了一些东西......

const ClientChoice = (props) => {
    const [selectedClient,setSelectedClient] = useState([]);

    function handleSelectChange(event) {
        setSelectedClient(event.target.value);
    }

    return (
        <select onChange={handleSelectChange}>
            <option value="one">One</option>
            <option value="two">Two</option>
            <option value="three">Three</option>
        </select>
    )
}

目标是null。

Answer 1

FC 的解决方案:为您的选择增加值(value)

const ClientChoice = (props) => {
    const [selectedClient,setSelectedClient] = useState([]);

    function handleSelectChange(event) {
        setSelectedClient(event.target.value);
    }

    return (
        <select value={selectedClient} onChange={handleSelectChange}> //set value here
            <option value="one">One</option>
            <option value="two">Two</option>
            <option value="three">Three</option>
        </select>
    )
}