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 從陣列末尾移除最後一項,減少陣列的...