onClick和onChange不会在reactjs中的safari单选按钮上触发

时间:2017-12-20 05:41:26

标签: reactjs safari

在ReactJS中处理Radio按钮上的事件的最佳做法是什么? 收音机按钮不适用于野生动物园 文档显示在“处理事件”文档中使用“onClick”,并在“Forms”文档中使用“onChange”。 onChange只在Radio Buttons上触发一次,所以我目前正在使用onClick。

1 个答案:

答案 0 :(得分:0)

带复选框的示例。使用单选按钮,我假设您有一个广播组。

构造函数:

constructor() {
    super();
    this.state = {
        agreements: false,
    };
    this.handleSwitchChange = this.handleSwitchChange.bind(this);
}

在函数handleSwitchChange

handleSwitchChange(event){
    const target = event.target;
    const value = target.type === 'checkbox' ? target.checked : target.value;
    const name = target.name;
    this.setState({
        [name]: value
    });
}

在渲染功能中:

           <div className="col-xs-12">
                <label className="label">
                    <input type="checkbox" name="agreements" checked={this.state.agreements} value={this.state.agreements} onClick={this.handleSwitchChange}/>
                    <span></span>
                    &nbsp;I agree to the term
                </label>
            </div>

编辑:handleSwitchChange函数不在渲染函数中;)