Vue JS - indexOf array is not a function

Question

I'm trying to check if a number is present in an array (which I've done a thousand times before using .indexOf()) but I seem to be missing something now.

Vue method

showSeat(seat) {
    if( !this.selectedSeats.length ) { 
        this.selectedSeats.push(seat)
    } else {
        let index = this.selectedSeats.indexOf(seat)
        ( index >= 0 ) ? this.selectedSeats.splice(index,1) : this.selectedSeats.push(seat)
    }
}

Initially, this.selectedSeats is equal to [], and the first condition runs perfectly. However, when I try to add another seat, I get [Vue warn]: Error in event handler for "showSeat": "TypeError: this.selectedSeats.indexOf(...) is not a function". What am I missing?

Maybe console.log this.selectedSeats before calling indexOf on it will provide a clue — Dexygen
– Dexygen, Commented Feb 24, 2019 at 14:23
well, from the error, I can only assume that this.selectedSeats is not an array. What do you get if you do console.log(Array.isArray(this.selectedSeats)); before let index ? — Nick Parsons
– Nick Parsons, Commented Feb 24, 2019 at 14:23
How about logging this.selectedSeats.indexOf (should be a native function). Also, is showSeats asynchronous? Maybe some more (but not too much) code for context? A jsfiddle or something? — Dexygen
– Dexygen, Commented Feb 24, 2019 at 14:30

David784 · Accepted Answer · 2019-02-24 14:34:54Z

4

This is one of those rare cases in JavaScript where leaving off a semicolon can cause huge problems. These two lines are being evaluated as a single expression:

 let index = this.selectedSeats.indexOf(seat)
 ( index >= 0 ) ? this.selectedSeats.splice(index,1) : this.selectedSeats.push(seat)

It's trying to execute this.selectedSeats.indexOf(seat)(index>=0)

Add a semicolon at the end of your indexOf(seat); and you should be fine.

answered Feb 24, 2019 at 14:34

David784

7,5243 gold badges24 silver badges35 bronze badges

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

6 Comments

Dexygen Over a year ago

Also can't the OP just not use parentheses around the first part of the ternary?

David784 Over a year ago

Absolutely, leaving off the parens would also solve the problem.

brunouno Over a year ago

Awesome! I'm starting write without semi-colons so I guess it was just a matter of time before I ran into this. Thanks.

Dexygen Over a year ago

@brunouno Better to always use semi-colons

David784 Over a year ago

There is a huge debate about that topic, and it all comes down to having a good understanding of ASI (Automatic Semicolon Insertion). This is a pretty good "opposing viewpoint" article, especially the line about: "If you 'never use semicolons', there’s only one rule: Never start a line with [, (, or `". (backtick because of tagged template literals)

|

Collectives™ on Stack Overflow

Vue JS - indexOf array is not a function

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related