Function cannot read property but other function can?

#1

Hello everyone, I am having a strange issue.
I have this function that works fine. And I want to write a function that does the opposite.

addToCart(e) {
    this.setState({
      cart: [...this.state.cart, [e.target.value, e.target.name, e.target.id]],
    });

So I wrote this function, but for some reason this one is telling me that “TypeError: Cannot read property ‘cart’ of undefined”
I don’t understand why this function is not working but the addtocart() is working just fine.

Removefromcart(e) {
    this.setState({
      cart: [
        this.state.cart.splice([e.target.value, e.target.name, e.target.id]),
      ],
    });

Thanks in advance for your expertise.
My full code is here.

#2

I see 2 opening curly braces but only closing one. Well , for me its kinda advanced JS . If you are hurry, post it on stackoverflow, you will receive your awaiting answer in few seconds.

#3
  1. You didn’t bind the method. I’d suggest just using arrow syntax instead.
Removefromcart = (e) => {
...code
}

  1. You are trying to mutate the cart array in the state, that is a big no-no.

  2. That is not how splice works.

  3. You are not passing the event to the method.

1 Like
#4

That’s what I call expertise!

  1. So I changed it to be an arrow function.
  2. I know I should not change the state directly, but what other options do I have in this case?
  3. So I will read up on how to use the splice function, i can see I was wrong.
  4. I thought that I was, what is the (e) for then?
    Thank you again for your help. You are like my personal mentor. (along with all of FCC)
#5

I’m going to add a post to your other thread. I think it is more relevant to the questions you have.

1 Like
#6

The method accepts a parameter, yes. But you didn’t pass in the event as an argument when calling the method.

#7