onClick и onChange не срабатывают на переключателях для сафари в reactjs

Как лучше всего обрабатывать события на радиокнопках в ReactJS? Радиокнопки не работают в сафари. В документации показано использование «onClick» в документации «Обработка событий», а также использование «onChange» в документации «Формы». onChange срабатывает только один раз на радиокнопках, поэтому в настоящее время я использую для них onClick.


reactjs safari
person Shobhit    schedule 20.12.2017    source источник
comment
У вас есть код, чтобы показать? Может быть, вырезать и вставить ошибку из консоли?   -  person Kyle Richardson    schedule 20.12.2017

Ответы (1)


arrow_upward
0
arrow_downward

Пример с флажком. Я предполагаю, что с радиокнопками у вас есть радиогруппа.

конструктор:

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 не находится в функции рендеринга;)

person Akim Benchiha    schedule 20.12.2017