here in my code i have 5 checkboxes that i want to push their values if they were checked but when i tick a checkbox and then tick another one an error displayes that says TypeError: Cannot read property 'value' of null
and this is my code:
import React, { useState, useEffect } from 'react';
import Label from '../../styles/Label';
function AlertReminder() {
const [selectedReminders, setSelectedReminders] = useState([]);
useEffect(() => {
console.log(selectedReminders);
}, [selectedReminders]);
const remindersList = '1 hour before,12 hour before,24 hour before,48 hour before,1 week ago'.split(',');
console.log(remindersList);
const changeHandler = (e) => {
if (selectedReminders.includes(e.target.value)) {
selectedReminders.splice(selectedReminders.indexOf(e.target.value), 1);
console.log(selectedReminders);
} else {
setSelectedReminders(selectedReminders => [...selectedReminders, e.target.value]);
console.log(selectedReminders);
}
};
return (
<div>
<Label>Alert Reminders:</Label>
<form>
{
remindersList.map(
(c) => (
<label>
{c}
<input type="checkbox" value={c} onChange={changeHandler} />
</label>
)
)
}
</form>
</div>
);
}
export default AlertReminder;
Aucun commentaire:
Enregistrer un commentaire