vue.js 删除指定元素_解析vue添加删除元素的方法

本篇文章给大家分享了vue添加删除元素的方法以及相关实例代码，有兴趣的朋友参考一下。

相关版实例代码如下：

vue实例：添加删除元素r

.form-group{

margin:10px;

}

.form-group>label{

display: inline-block;

width: 5rem;

text-align: right;

}

name:

age:

sex:

男

女

Create

NameAgeSexDelete

{{item.name}}{{item.age}}{{item.sex}}Delete

var vm = new Vue({

el:'#app',

data:{

newitems:{

name:'',

age:'18',

sex:'女'

},//newitems默认的

items:[{

name:'lily',

age:18,

sex:'女'

},{

name:'lily',

age:18,

sex:'女'

},{

name:'lily',

age:18,

sex:'女'

},{

name:'lily',

age:18,

sex:'女'

},{

name:'lily',

age:18,

sex:'女'

}]

},

methods:{

addPerson:function(){

this.items.push(this.newitems)//往items中添加newitems

this.newitems = {name:'',age:'18',sex:'女'}

},//添加元素

deletePerson: function(index){

// 删一个数组元素

this.items.splice(index,1);

}

}

})

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

相关推荐：