使用vue.js实现checkbox的全选和多个的删除功能
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
|
<script> var proData = [{ "name" : "j1ax" }, { "name" : "j2ax" }, { "name" : "j3ax" }, { "name" : "j4ax" }] export default { name: 'hello' , data() { return { proData: proData, selectArr: [] } }, created() { this .$http.get( '/api/home' ).then( function (response) { response = response.body; this .proData = response.data; }) }, methods: { del() { let arr = []; var len = this .proData.length; for ( var i = 0; i < len; i++) { if ( this .selectArr.indexOf(i)>=0) { console.log( this .selectArr.indexOf(i)) } else { arr.push(proData[i]) } } this .proData = arr; this .selectArr = [] }, selectAll(event) { var _this = this ; console.log(event.currentTarget) if (!event.currentTarget.checked) { this .selectArr = []; } else { //实现全选 _this.selectArr = []; _this.proData.forEach( function (item, i) { _this.selectArr.push(i); }); } } } } </script> |
分类:
JavaScript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· Qt个人项目总结 —— MySQL数据库查询与断言
2016-11-23 【转】Popclip的JSON格式化扩展
2016-11-23 【转】json格式化、高亮库jsonFormater
2016-11-23 Mac OS X El Capitan系统完整性保护System Integrity Protection (SIP)
2015-11-23 PDF模板报表导出(Java+Acrobat+itext)
2015-11-23 JAVA LinkedList和ArrayList的使用及性能分析