How vue.js moves the array position and updates the view

This time I will show you how vue.js operates to move the arrayposition and updateview, vue.js operates the array to move the position and updates the view. NotesWhat are the following? Let’s take a look at the actual cases.

Use vue.js v-for to bind several options, and you need to sort the options and move them up and down.

It is necessary to exchange the position of the array in options. It is usually written like this:

Assume moving forward one:

var index = this.options.indexOf(option); //获取当前选项对象在数组里面的索引。
var tempOption = this.options[index-1]; //存储前一个
this.options[index-1] = option;(this.options[index])
this.options[index] = tempOption;

This does change the order of the array, but the view is not updated and moved. For details, see the description of the array on the vue official website.

One of the solutions is to change its object and use vue’s set method:

var index = options.indexOf(option); 
var tempOption = options[index - 1]; 
Vue.set(options, index - 1, options[index]); 
Vue.set(options, index, tempOption);

I believe you have read the case in this article After mastering the method, please pay attention to other related articles on the php Chinese website for more exciting content!

Recommended reading:

How to publish the vue project through Baidu's BAE

Why axios http request cannot be used in vue2

The above is the detailed content of How vue.js moves the array position and updates the view. For more information, please follow other related articles on the PHP Chinese website!