Vue陣列操作

2021-08-07 17:07:05 字數 771 閱讀 9051

vue中陣列的操作總結： 

一、根據索引設定元素： 

1、呼叫$set方法：

this.arr.$set(index, val);
2、呼叫splice方法：

this.arr.splice(index, 1, val);
二、合併陣列：

this.arr = this.arr


.concat(anotherarr);
三、清空陣列：

this.arr =;
四、主要的陣列方法： 

1、變異方法（修改了原始陣列），vue為觸發檢視更新，包裝了以下變異方法：

push()


pop()


shift()


unshift()


splice()


//無論何時，使用該方法刪除元素時注意陣列長度有變化，bug可能就是因為她


sort()


reverse()
2、非變異方法（不會修改原始陣列而是返回乙個新陣列），如concat()、filter()，使用時直接用新陣列替換舊陣列，如上面的合併陣列例子。

五、注意：

//以下操作均無法觸發檢視更新


this.arr[index] = val;


this.arr.length = 2;
詳細了解請參考vue官方文件陣列變動檢測。

vue陣列操作

vue中陣列的操作總結 一 根據索引設定元素 1 呼叫 set方法 this.arr.set index,val 2 呼叫splice方法 this.arr.splice index,1,val 二 合併陣列 this.arr this.arr concat anotherarr 三 清空陣列 th...

vue 陣列操作

根據下標修改陣列元素 set this set this list,0,根據下標在指定的位置加入 修改 刪除元素 在下標為的2陣列元素前插入資料 this list.splice 2 0,修改下標為2的陣列元素 this list.splice 2 1,修改下標為2和3的元素 this list.s...

vue呼叫陣列 Vue陣列

vue為了增加列表渲染的功能，增加了一組觀察陣列的方法，而且可以顯示乙個陣列的過濾或排序的副本。變異方法 vue 包含一組觀察陣列的變異方法，它們將會觸發檢視更新，包含以下方法 push 接收任意數量的引數，把它們逐個新增到陣列末尾，並返回修改後陣列的長度 pop 從陣列末尾移除最後一項，減少陣列的...