溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

vue.js移動數(shù)組位置,同時更新視圖的方法

發(fā)布時間：2020-10-18 08:13:03 來源：腳本之家 閱讀：180 作者：xiaoqiu_net 欄目：web開發(fā)

使用vue.js v-for綁定若干個選項，需要對選項進(jìn)行排序上下移動操作。

vue.js移動數(shù)組位置,同時更新視圖的方法

需要對options里面數(shù)組的位置進(jìn)行交換，通常是這樣來寫：

假設(shè)向前移動一個：

var index = this.options.indexOf(option); //獲取當(dāng)前選項對象在數(shù)組里面的索引。
var tempOption = this.options[index-1]; //存儲前一個
this.options[index-1] = option;(this.options[index])
this.options[index] = tempOption;

這樣的確改變了數(shù)組的順序，但是視圖卻沒有更新移動。詳見vue官網(wǎng)數(shù)組的描述.

解決辦法之一是改變他的對象，使用vue的set方法：

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

以上這篇vue.js移動數(shù)組位置,同時更新視圖的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持億速云。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手