ReactJS - 即使从选择下拉列表中选择了相同的选项,也会触发事件

Question

如何从ReactJS中的下拉列表中选择一个选项时触发事件.目前我正在使用,onChange但即使再次选择相同选项,我也需要触发事件.

当前代码:

<select name="select1" onChange={this.onChangeOption}>
    <option value='A'>Please select A...</option>
    <option value='B'>Please select B...</option>
    <option value='C'>Please select C...</option>
    <option value='D'>Please select D...</option>
</select>

我甚至尝试添加onClick处理程序到选项,但是不会点击选项,因为它只适用于元素.

我知道有一些解决方案使用jquery通过将click事件与option元素绑定,但需要在React中使用解决方案.不想只为这个要求包含jQuery.

Answer 1

这是一个技巧,但如果您需要使用所有更改来触发功能,即使更改了相同选项,也只需要一个我知道的解决方案 - 使用onClick及其详细信息:

class Select extends React.Component{
    onChangeOption(e){
        if (e.detail === 0){
            console.log(e.target.value);
        }
    }
    render(){
        return (
            <select name="select1" onClick={this.onChangeOption}>
                <option value='A'>Please select A...</option>
                <option value='B'>Please select B...</option>
                <option value='C'>Please select C...</option>
                <option value='D'>Please select D...</option>
            </select>
        )
    }
}

https://jsfiddle.net/69z2wepo/86140/