前言:vue不能直接通過下標的形式來添加數據,vue也不能直接向對象中插值,因為那樣即使能插入值,頁面也不會重新渲染數據
一,vue遍歷數組
1,使用vue數組變異方法
pop() 刪除數組最后一項
push() 往數組里面末尾增加一項
shift() 刪除數組第一項
unshift() 往數組第一項里面加一些內容
splice() 向數組里面增加一項或刪除一項
sort() 數組排序
reverse() 對數組取反
2,數組的引用
數組在js中是引用類型,重新給需要改變的數組進行定義並賦值,即對象引用方法
3,vue set方法
以下面數組為例
tabList:[1,2,3,4,5 ]
1)全局set方法使用
Vue.set(vm.tabList,1,10) //將數組下標為1的值改為10
2)實例set方法使用
vm.$set(vm.tabList,1,10) //將數組下標為1的值改為10
二,vue遍歷對象
1,對象引用
與遍歷數組類似,重新給對象賦值(全部的值)
2,set方法(vm是我定義vue的一個實例)
set方法既是vue全局方法也是vue實例方法
以下面對象為例
tabObj{
name: "Guang Li",
sex: "男“
}
1)全局set方法使用
Vue.set(vm.tabObj,"address","BeiJing")
2)實例set方法使用
vm.$set(vm.tabObj,"address","BeiJing")
由於時間問題下回仔細說明,謝謝
今天補充說明一下push()和splice()的用法。
假入有一個數組如下
tableList: [{
a: '112301',
b: '大紅袍超級',
e: '1314520',
c: '2018-10-1',
d: '成功'
},
{
a: '112301',
b: '大紅袍超級',
e: '1314520',
c: '2018-10-1',
d: '成功'
},
],
1,push() ----push() 方法可把它的參數順序添加到 tableList1的尾部。它直接修改 tableList1,而不是創建一個新的數組
比如向數組tableList1加一個新的對象:
this.tableList1.push(
{
a: '123',
b: 124'',
e: 124'',
c: 124'',
d: '成功'
}
);
2,splice() --- splice() 方法向/從數組中添加/刪除數據,然后返回被刪除的項目。(splice() 方法可刪除從 index 處開始的零個或多個元素,並且用參數列表中聲明的一個或多個值來替換那些被刪除的元素。)

例如: this.tableList1.splice(0, 1) //表示從數組第一個對象開始刪除一項
