[英]React JS onChange event in checkbox is not working properly
codeandbox.io/s/beautiful-sid-dy97k?file=/src/App.js 演示 url 用于复选框
const handleOnChange = async (position) => {
const updatedCheckedState = Filter.contract.map((item, index) =>
index === position ? !item : item
);
await setFilter((e) => ({ ...e, contract: updatedCheckedState }));
};
// this is checkbox code
{[
"Bank",
"Agency",
"Permanent",
"Ad Hoc",
"Temporary",
"Part Time",
"Contractual"
].map((item, i) => {
return (
<Form.Group controlId="formBasicCheckbox">
<Form.Check
onChange={() => handleOnChange(i)}
type="checkbox"
label={item}
/>
</Form.Group>
);
})}
这是我的复选框逻辑,当我单击 label 中的任何一个时,然后检查第一项。 我不知道如何爱它
实际行为应该是如果用户 select 在 label 上,那么它也应该检查。
所以问题出在我的 <form.check> 标记中,我们需要在该标记中提供 ID,例如
<Form.Check
id={i.toString()} // unique id should be there
onChange={() => handleOnChange(i)}
type="checkbox"
label={item}
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.