在反應鈎子中，如果用戶 select 值相同，則 onChange 不會觸發

Question

這是我的代碼

function SelectBugDemo(){
  var [value,set_value]=React.useState('one')
  var [count,set_count]=React.useState(1)
  
  function render_option(x){
      return <option key={x} value={x}>{x}</option>
  }    
  function onChange(event){
      console.log('onChange')//some side effect here
      set_value(event.target.value)
      set_count(x=>x+1)
  }    
  return <>{count}<select {...{onChange,value}}> {['one','two'].map(render_option)}</select></>
}

問題是如果用戶 select 的值相同，則不會調用 onChange。 我添加了計數來演示問題 - 在選擇不同的值時它會增加，但在選擇相同的值時不會增加。

有什么方法可以捕獲相同值的用戶選擇？ 我試過onSelect，但沒有用

Answer 1

onChange僅在值更改時觸發。

嘗試將onBlur添加到您的 select 。

<select  onChange={onChange} onBlur={onChange} value={value}>