我正在嘗試在 React 中制作 select 組件，但 onChange 偵聽器不起作用

Question

我想在我的表單中創建一個 select 國家/地區組件，但在我的<select> onChange 偵聽器中由於某種原因無法正常工作

<Form.Group className="form-group">
       <Form.Label htmlFor="country">Country</Form.Label>
        <div className="form-control-wrap">
             <select className="form-select form-select-lg" id="country" name="country"
                    onChange={e => console.log("Changed")}>
                    <option value={"select-country"}>Select Country</option>
                    {
                       countries.map((c) => {
                             return (<option value={c.name}>{c.name}</option>)})}
            </select>
       </div>
</Form.Group>

當我 select 一個國家/地區什么都不會打印在控制台上時，應該在那里打印“已更改”

Answer 1

我不確定問題是什么，它有效。 你能創建一個這樣的代碼片段來重現你的錯誤嗎？

 const countries = [{ name: 'germany' }]; const App = () => { return ( <select className="form-select form-select-lg" id="country" name="country" onChange={e => console.log("Changed")}> <option value="select-country">Select Country</option> {countries.map((c) => <option value={c.name}>{c.name}</option>)} </select> ) }; ReactDOM.render(<App />, document.getElementById('app'));

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> <div id="app">hi</div>