<template>
<div>
<ul>
<li v-for="(item,index) in list" >{{item.name}}-{{item.age}}-{{index}}</li>
</ul>
<button v-on:click="additem">additem</button>
</div>
</template>
<script>
//import componenta from './components/a'
export default {
/*components :{
componenta: componenta
},*/
data(){
return{
hello: 'world',
list:[
{
name:"mike",
age:18
}
]
}},
methods: {
additem (){
this.list.push({
name:"cwy",
age:18
})
}
}
<div>
<ul>
<li v-for="(item,index) in list" >{{item.name}}-{{item.age}}-{{index}}</li>
</ul>
<button v-on:click="additem">additem</button>
</div>
</template>
<script>
//import componenta from './components/a'
export default {
/*components :{
componenta: componenta
},*/
data(){
return{
hello: 'world',
list:[
{
name:"mike",
age:18
}
]
}},
methods: {
additem (){
this.list.push({
name:"cwy",
age:18
})
}
}
}
push可以触发数组更新,直接赋值和改变长度不可以
改变数组某一项;
import Vue from 'vue'
Vue.set(this.list,1,{
name:'123',
age:11
})