第Vue中對數(shù)組和對象進行遍歷和修改方式目錄對數(shù)組和對象進行遍歷和修改1、對數(shù)組進行循環(huán)2、修改數(shù)組的時候，不能直接通過下標(biāo)去增加修改刪除3、對對象進行循環(huán)4、增加對象的時候修改數(shù)組和對象的特殊情況以及修改方法修改數(shù)組的兩個特殊情況修補方法

對數(shù)組和對象進行遍歷和修改

1、對數(shù)組進行循環(huán)

v-for進行循環(huán)，有兩個參數(shù)（item，index）

注意：template可以成為占位符，在DOM里面不顯示

2、修改數(shù)組的時候，不能直接通過下標(biāo)去增加修改刪除

（1）可以用過push/pop/shift/unshift/splice/sort/reverse方法

（2）也可以直接改變（重新定義）list數(shù)組的整體（varlist=[]）

（3）全局的Vue.set(app7.list,1此處代表下標(biāo),2)

局部的app7.$set(app7.list,1此處代表下標(biāo),2)

3、對對象進行循環(huán)

v-for進行循環(huán)，有三個參數(shù)（item，index，key）

4、增加對象的時候

（1）通過重新定義引用的對象（varobj={}）

（2）set方法全局的Vue.set(app7.obj,sex此處代表要增加的屬性,女)

局部的app7.$set(app7.obj,sex此處代表要增加的屬性,女)

!--v-for的使用--

divid="app7"

//對數(shù)組進行循環(huán)

templatev-for="(item,index)oflist":key="item.id"

div

{{item.text}}----{{index}}

/div

span

{{item.text}}----{{index}}

/span

/template

//對對象進行循環(huán)

templatev-for="(item,index,key)ofobj"

div

{{item}}----{{index}}-----{{key}}

/div

/template

/div

script

varapp7=newVue({

el:'#app7',

data:{

list:[

id:"1",

text:'1'

id:"2",

text:'2'

id:"3",

text:'3'

obj:{

name:'mao',

age:28,

address:'liulin'

/script

修改數(shù)組和對象的特殊情況以及修改方法

div部分

divid="root"

{{title}}

my-header/my-header

{{list}}

{{obj}}

/div

divid="app"

{{title}}

/div

script部分

script

//全局定義的組件

Vponent('my-header',{

template:`

headertitle/header

`

})

//實例化Vue

varvm=newVue({

el:'#root',

data:{

title:'hello',

list:['a','b'],

obj:{

x:0

}

}

})

varvm2=newVue({

el:'#app',

data:{

title:'world'

}

})

/script

修改數(shù)組的兩個特殊情況

1.arr.length=0,不具備響應(yīng)特性

2.arr[0]=100,不具備響應(yīng)特性

修改對象的特殊情況添加obj.x，x屬性，也不具備響應(yīng)特性

修補方法

vm.$set(target,propertyName/index,value)//實例化一個vue，試用貼set屬性改變對應(yīng)的value值

Vue.set(target,pro