Я пытаюсь создать компонент select в React, но прослушиватель onChange не работает

#reactjs #select #onchange

#реагирует на #выбирать #по обмену

Вопрос:

Я хочу создать компонент выбора страны в своей форме, но в моем lt;selectgt; прослушивателе onChange по какой-то причине не работает

 lt;Form.Group className="form-group"gt;  lt;Form.Label htmlFor="country"gt;Countrylt;/Form.Labelgt;  lt;div className="form-control-wrap"gt;  lt;select className="form-select form-select-lg" id="country" name="country"  onChange={e =gt; console.log("Changed")}gt;  lt;option value={"select-country"}gt;Select Countrylt;/optiongt;  {  countries.map((c) =gt; {  return (lt;option value={c.name}gt;{c.name}lt;/optiongt;)})}  lt;/selectgt;  lt;/divgt; lt;/Form.Groupgt;  

Когда я выбираю страну, на консоли ничего не печатается, когда там должно быть напечатано «Изменено».

Ответ №1:

Я не уверен, в чем проблема, это работает. Можете ли вы создать такой обрезанный код, чтобы воспроизвести свою ошибку?

 const countries = [{ name: 'germany' }];  const App = () =gt; {  return (  lt;select className="form-select form-select-lg" id="country" name="country"  onChange={e =gt; console.log("Changed")}gt;  lt;option value="select-country"gt;Select Countrylt;/optiongt;  {countries.map((c) =gt; lt;option value={c.name}gt;{c.name}lt;/optiongt;)}  lt;/selectgt;  ) }; ReactDOM.render(lt;App /gt;, document.getElementById('app')); 
 lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"gt;lt;/scriptgt; lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"gt;lt;/scriptgt; lt;div id="app"gt;hilt;/divgt;