vue為了增加列表渲染的功能，增加了一組觀察陣列的方法，而且可以顯示乙個陣列的過濾或排序的副本。
變異方法
vue 包含一組觀察陣列的變異方法，它們將會觸發檢視更新，包含以下方法：
push() 接收任意數量的引數，把它們逐個新增到陣列末尾，並返回修改後陣列的長度
pop() 從陣列末尾移除最後一項，減少陣列的length值，然後返回移除的項
shift() 移除陣列中的第乙個項並返回該項，同時陣列的長度減1
unshift() 在陣列前端新增任意個項並返回新陣列長度
splice() 刪除原陣列的一部分成員，並可以在被刪除的位置新增入新的陣列成員
sort() 呼叫每個陣列項的tostring()方法，然後比較得到的字串排序，返回經過排序之後的陣列
reverse() 用於反轉陣列的順序，返回經過排序之後的陣列
popshift
unshift
splice
sort
reverse
data: ,
,addvalue:
methods:{
push(){
this.items.push(this.addvalue)
pop(){
this.items.pop()
shift(){
this.items.shift()
unshift(){
this.items.unshift(this.addvalue)
splice(){
this.items.splice(0,1)
sort(){
this.items.sort()
reverse(){
this.items.reverse()
非變異方法
變異方法(mutation method)，顧名思義，會改變被這些方法呼叫的原始陣列。相比之下，也有非變異(non-mutating method)方法，例如： filter(), concat(), slice() 。這些不會改變原始陣列，但總是返回乙個新陣列。當使用非變異方法時，可以用新陣列替換舊陣列。
concat() 先建立當前陣列乙個副本，然後將接收到的引數新增到這個副本的末尾，最後返回新構建的陣列。
slice() 基於當前陣列中乙個或多個項建立乙個新陣列，接受乙個或兩個引數，即要返回項的起始和結束位置，最後返回新陣列。
map() 對陣列的每一項執行給定函式，返回每次函式呼叫的結果組成的陣列、
filter() 對陣列中的每一項執行給定函式，該函式會返回true的項組成的陣列
concat
slice
mapfilter
data: {
items: ['foo','bar','baz'],
addvalue:'match'
methods:{
concat(){
this.items = this.items.concat(this.addvalue)
slice(){
this.items = this.items.slice(1)
map(){
this.items = this.items.map(function(item,index,arr){
return index + item;
filter(){
this.items = this.items.filter(function(item,index,arr){
return (index > 0);
以上操作並不會導致vue丟棄現有dom並重新渲染整個列表。vue實現了一些智慧型啟發式方法來最大化dom元素重用，所以用乙個含有相同元素的陣列去替換原來的陣列是非常高效的操作。
無法檢測
由於js的限制， vue 不能檢測以下變動的陣列：
1、利用索引直接設定乙個項時，例如： vm.items[indexofitem] = newvalue
2、修改陣列的長度時，例如： vm.items.length = newlength
以下兩種方式都可以實現和vm.items[indexofitem]=newvalue相同的效果， 同時也將觸發狀態更新
// vue.set
vue.set(example1.items, indexofitem, newvalue)
// array.prototype.splice
arr.items.splice(indexofitem, 1, newvalue)
vue 陣列中巢狀陣列 vue陣列巢狀陣列的問題
如圖，餅乾 健康零食 早點下午茶 中式糕點 西式糕點是外層的陣列，用v for來完成，但是陣列裡面還有乙個陣列，這個還是用v for嗎？應該怎麼做？我就是在v for裡面又用了乙個v for，如下 模板class productclassificationlist v for list in pro...
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陣列操作
vue中陣列的操作總結 一 根據索引設定元素 1 呼叫 set方法 this.arr.set index,val 2 呼叫splice方法 this.arr.splice index,1,val 二 合併陣列 this.arr this.arr concat anotherarr 三 清空陣列 th...