شرح صفوف ومحتوى الفقرة
تمثل خانة الاختيار المنفردة — مثل الموافقة على الشروط أو إظهار المنتجات المتوفرة فقط — قيمة منطقية صريحة (true أو false) وليست نصاً؛ لذلك نربط حالتها بخاصية checked بدلاً من value.
وداخل معالج التغيير اقرأ e.target.checked دائماً؛ فقراءة e.target.value خطأ شائع يعيد النص الثابت "on" سواء كانت الخانة محددة أم غير محددة.
HTML
function EnrollmentConsent() {
const [ok, setOk] = useState(false);
return (
<form>
<input type="checkbox" checked={ok}
onChange={(e) => setOk(e.target.checked)} />
<span>Accept honor code</span>
<button disabled={!ok}>Start Exam</button>
</form>
);
}