vue 实现删除对象的元素 delete
更新时间：2022年03月03日 15:39:57 作者：vue学习
这篇文章主要介绍了vue 实现删除对象的元素delete，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
删除对象的元素 delete
data中定义一个form
data: {
seen: true,
from:{
id:'',
name:'',
age:'',
}
}现在不需要age元素
删除 delete this.from.age;
场景form表单提交的时候新增的数据和编辑页面公用一个页面 ，在添加的时候不需要id而就可以delete删除id
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 </title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
<script>
new Vue({
el: '#app',
data: {
seen: true,
from:{
id:'',
name:'',
age:'',
}
},
mounted() {
//this.initData();
this.from.id=1;
this.from.name='xc';
this.from.age=18;
this.from.content='xcvzxcvzxcv'; //直接添加元素
delete this.from.age;//删除age元素
console.log(this.from)
},
})
</script>
</body>
</html>vue根据id删除某一行
methods:{
del(id){
//ES6
//根据id查找元素 findIndex
//let index = arr.findIndex(function(ele,index,arr){return ele.id==id})
//函数内如果返回true，就结束遍历并返回当前index;
//index如果没有找到返回-1
let index = this.tasks.findIndex(funciton(ele){
return ele.id == id;
})
//假设没有找到
if(index === -1){
return console.log('删除失败');
}
//删除元素
this.tasks.splice(index,1);
}
}以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了最全面的JVM优化经验总结,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，,需要的朋友可以参考下2019-06-06
本篇文章主要介绍了Spring Boot 读取静态资源文件的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
这篇文章主要给大家介绍了关于如何使用Java生成PDF文档的相关资料,PDF是可移植文档格式,是一种电子文件格式,具有许多其他电子文档格式无法相比的优点,需要的朋友可以参考下2023-07-07
本文给大家介绍使用Java实现扫雷小游戏，本程序封装了五个类，分别是主类GameWin类，绘制底层地图和绘制顶层地图的类MapBottom类和MapTop类，绘制底层数字的类BottomNum类，以及初始化地雷的BottomRay类和工具GameUtil类，用于存静态参数和方法，感兴趣的朋友一起看看吧2022-05-05
这篇文章主要为大家详细介绍了Java Spring开发入门学习教程,具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2021-09-09
在本篇文章中，小编会带大家学习面向对象中关于对象的创建之显示创建和隐式创建，其实类和对象作为面向对象中最基本的，也是最重要的,需要的朋友可以参考下2023-05-05
Logback MDCAdapter日志跟踪及自定义效果源码解读
这篇文章主要为大家介绍了Logback MDCAdapter日志跟踪及自定义效果源码解读,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-11-11
Spring Bean生命周期之Bean元信息的配置与解析阶段详解
这篇文章主要为大家详细介绍了Spring Bean生命周期之Bean元信息的配置与解析阶段，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2022-03-03
Mybatis报错日志BindingException的解决
本文主要介绍了Mybatis报错日志BindingException的解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
这篇文章主要介绍了Java中的悲观锁与乐观锁是什么，帮助大家更好的理解和学习Java锁的相关知识，感兴趣的朋友可以了解下2020-09-09
最新评论