onClick dan onChange tidak mengaktifkan tombol radio untuk safari di reactjs

Apa praktik terbaik untuk menangani peristiwa di Radio Buttons di ReactJS? Tombol Radio tidak berfungsi di safari. Dokumentasi menunjukkan penggunaan "onClick" pada dokumentasi "Menangani Acara" dan menunjukkan penggunaan "onChange" dalam dokumentasi "Formulir". onChange hanya diaktifkan satu kali di Tombol Radio, jadi saat ini saya menggunakan onClick untuk tombol tersebut.


person Shobhit    schedule 20.12.2017    source sumber
comment
Apakah Anda memiliki kode untuk ditampilkan? Mungkin kesalahan potong dan tempel dari konsol?   -  person Kyle Richardson    schedule 20.12.2017


Jawaban (1)


Contoh dengan kotak centang. Dengan tombol radio saya berasumsi Anda memiliki grup radio.

konstruktor:

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

Dalam fungsi handleSwitchChange

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

Dan dalam fungsi render:

           <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>

Sunting: fungsi handleSwitchChange tidak ada dalam fungsi render;)

person Akim Benchiha    schedule 20.12.2017