CODEWITHSUNDEEP
javascriptvue.js
Jenssen
Jenssen

Reputation: 1871

Vue.js swap array items

In my vue.js application I'm trying to swap 2 forum rows like this:

export default {
        data() {
            return {
                forums: []
            }
        },

        methods: {
            increment(forum, index) {
                ForumService.increment(forum)
                    .then(() => {
                        let b = this.forums[index];
                        this.forums[index] = this.forums[index++];
                        this.forums[index++] = b;
                    });
            }
        }
    }

But nothing happens? What am I doing wrong here?

Upvotes: 11

Views: 6681

Answers (1)

Justin MacArthur
Justin MacArthur

Reputation: 4050

While @dfsq is correct about the use of index++ Vue doesn't recognize native mutations of arrays due to the inability to observe them. you have to use a mutation method to change them.

try this:

.then(() => {
  let rows = [this.forums[index], this.forums[index + 1]];
  this.forums.splice(index, 2, rows[1], rows[0] );
});

I haven't tested it and I'll edit when I can.

Upvotes: 21

Related Questions