I am struggling with logic on how to check off these checkboxes individually. I want to be able to check off a list item when I visit a slide/click a list item.
"context.index" is mapped to an array and renders the list. "context.currentSlide" is the array index number. My thought it to set the checkbox to checked based on the currentslide number, but so far it checks all of them..Do i need to use e.target.checked somehow?
MY ATTMEPT
const [isChecked, setIsChecked] = useState(false);
const checkHandler = (param) => {
if (param === context.currentSlide) {
setIsChecked(true);
}
};
return(
<div>
{context.index &&
context.index.map((title, i) => (
<div
key={i}
onClick={() => {
checkHandler();
}}
>
<input type="checkbox" checked={isChecked} onChange={checkHandler} />
<div>
{i}. {title}
</div>
</div>
))}
</div>
);
Aucun commentaire:
Enregistrer un commentaire