vue学习(十三) 删除对象数组中的某个元素
//html <div id="app">
//v-for循环就不写了 每一条数据最后都有一个删除的超链 .prevent阻止默认的跳转行为 只执行点击事件
<a href="" @click.prevent="del(item.id)">删除</a> </div> //script <script> var vm = new Vue({ el:'app', data:{ id:'',
name:'',
list:[
{id:1, name:'惊鲵'},
{id:2, name:'掩日'},
{id:2, name:'黑白玄翦'}
] }, methods:{//methods中定义了当前vue实例中所有可用的方法 del(id){
this.list.some((item, i)=>{
if(item.id==id){
this.list.splice(i, 1)
//在数组的some方法中,如果return true,就会立即终止这个数组的后续循环
return true
}
})
},
del(id){
var index = this.list.findIndex(item =>{
if(item.id==id){
return true
}
})
this.list.splice(index,1)
}
} }) </script>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步