แนวปฏิบัติที่ดีที่สุดในการจัดการเหตุการณ์บนปุ่มตัวเลือกใน ReactJS คืออะไร ปุ่มตัวเลือกไม่ทำงานในซาฟารี เอกสารแสดงการใช้ "onClick" ในเอกสาร "การจัดการเหตุการณ์" และแสดงโดยใช้ "onChange" ในเอกสารประกอบ "แบบฟอร์ม" onChange เริ่มทำงานเพียงครั้งเดียวบนปุ่มตัวเลือก ดังนั้นฉันจึงใช้ onClick สำหรับปุ่มเหล่านั้น
onClick และ onChange จะไม่เริ่มทำงานบนปุ่มตัวเลือกสำหรับซาฟารีใน reactjs
comment
คุณมีรหัสใด ๆ ที่จะแสดง? อาจเป็นการตัดและวางข้อผิดพลาดจากคอนโซลใช่ไหม
- person Kyle Richardson   schedule 20.12.2017
คำตอบ (1)
ตัวอย่างพร้อมช่องทำเครื่องหมาย ด้วยปุ่มตัวเลือก ฉันถือว่าคุณมีกลุ่มวิทยุ
ตัวสร้าง :
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>
I agree to the term
</label>
</div>
แก้ไข: ฟังก์ชัน handleSwitchChange ไม่ได้อยู่ในฟังก์ชันการเรนเดอร์ ;)
person
Akim Benchiha
schedule
20.12.2017