Remove element from array when checkbox is unchecked (filter method is not working?)

Question

I have this stateful variable

const [validMonths2019, setValidMonths2019] = useState([])

Now when the checkboxed is checked the event handler will get called

   <Form.Check label='Januar 2019' id='2019' onChange={(event) => handleCheck('01', event)} />

This is the event handler

  function handleCheck (value, event) {
    const months2019 = [...validMonths2019]
    if (event.target.id === '2019' && event.target.checked) {
      console.log(value) // value is 01
      months2019.push(value)
      setValidMonths2019(months2019)
    } else if (event.target.id === '2019' && !event.target.checked) {
      console.log(value) // value is 01
      months2019.filter(item => item !== value)
      console.log(months2019)// months2019 is still the same array.
      setValidMonths2019(months2019)
    } 
  }

The filter method isn't doing anything. The array stays the same.

Edgar Henriquez · Accepted Answer · 2020-04-06 01:25:42Z

1

Filter does not mutate the array, instead, it returns a new array so you need to capture it's value

const myNewArray = months2019.filter(item => item !== value)
console.log(myNewArray) //<-- Here is your filtered array

answered Apr 6, 2020 at 1:25

Edgar Henriquez

1,3731 gold badge15 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Remove element from array when checkbox is unchecked (filter method is not working?)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related