vue.js删除列表中的一行
更新时间：2018年06月30日 09:39:12 作者：时光足迹
这篇文章给大家分享了vue.js删除列表中的一行的实例操作以及代码分享，有兴趣的朋友参考下。
splice(index,num,item1,item2,...,itemX) 方法向/从数组中添加/删除项目，然后返回被删除的项目。
注：index--规定添加/删除项目的位置
num--要删除的项目数量
item--向数组添加的新项目
splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。
(1)html代码：
<div id="app">
<ul>
<li v-for="todo in todos">
<span>{{ todo.text }}</span>
<button @click="removeTodo($index)">X</button>
</li>
</ul>
</div>
（2）js代码：
<script>
new Vue({
el: '#app',
data: {
todos: [
{ text: 'Add some todos' },
{ text: 'Learn JavaScript' },
{ text: 'Learn Vue.js' },
{ text: 'Build Something Awesome' }
]
},
methods: {
removeTodo: function (index) {
this.todos.splice(index, 1);
}
}
})
</script>
（3）效果展示：
相关文章
这篇文章主要介绍了Vue 配置代理详情，文章围绕主题的相关资料展开详细内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下，希望对你的学习有所帮助2022-04-04
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
这篇文章主要介绍了vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2019-04-04
vue+elementUi 实现密码显示/隐藏+小图标变化功能
这篇文章主要介绍了vue+elementUi 实现密码显示/隐藏+小图标变化功能,需本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下2020-01-01
Typescript 5年内的热度随时间变化的趋势，整体呈现一个上升的趋势。也说明ts越来越️受大家的关注了。这篇文章主要介绍了Vue 中使用 typescript的方法详解,需要的朋友可以参考下2020-02-02
基于elementUI使用v-model实现经纬度输入的vue组件
这篇文章主要介绍了基于elementUI使用v-model实现经纬度输入的vue组件,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下2019-05-05
表单校验是注册环节中必不可少的操作,表单校验可以提醒用户填写数据规则以确保用户提交数据的效性,也可以防止用户因误操作而占用服务器资源,这篇文章主要给大家介绍了关于Vue系列之Element UI表单自定义校验规则的相关资料,需要的朋友可以参考下2022-09-09
实习工作需要根据表格的状态字段来设置列的样式,所以这篇文章主要给大家介绍了关于element plus如何为表格某列数据文字设置颜色样式的相关资料,需要的朋友可以参考下2023-10-10
这篇文章主要介绍了.netcore+vue 实现压缩文件下载功能,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-09-09
TypeScript 是一种由微软开发的自由和开源的编程语言，它是 JavaScript 的一个超集，扩展了 JavaScript 的语法。这篇文章主要介绍了Vue新搭档TypeScript快速入门实践,需要的朋友可以参考下2021-06-06
这篇文章主要介绍了让Vue响应Map或Set的变化操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
最新评论