简述自己遇到的问题,觉得合适就拿去用

我在使用v-for遍历checked复选框数据的时候,数据分为两部分,一个主活动,主活动下面有多个子活动

我实体类的设计是里面加个list放子活动,

页面循环需要遍历主活动和子活动,

那这样内部的子活动就v-for,主活动就不能遍历了,主活动默认选中,

之后需要全选操作,遇到的问题就是点击全选无法选中第一个,

但是断点查看的时候,却发现在断点结束前是选中的,这个就很无语

之后解决了,我就直接贴代码了

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
</head> <body>
<section class="layout" id="app">
<section class="content content-login">
<label>
<input type="checkbox" :value="dataList" v-model="param">
{{dataList.name}}
<br/>
</label>
<label v-for="item in dataList.list">
<input type="checkbox" :value="item" v-model="param"/>
{{item.name}}
<br/>
</label>
<br/> <label > <input type="checkbox" v-model="selectAll" @change="allChange"> 全选</label> <br/> {{param}}
</section>
</section>
</body> </html> <script src="vue.js"></script>
<script type="text/javascript">
new Vue({
el: '#app',
data: {
selectAll: false,
dataList: {
recno: 1,
name: 'd1',
list: [{
recno: 2,
name: 'd2'
}, {
recno: 3,
name: 'd3'
}, {
recno: 4,
name: 'd4'
}]
},
param:[]
},
methods: {
allChange: function() {
if(this.selectAll) {
this.param = [];
this.param.push(this.dataList);
for(var i in this.dataList.list) {
this.param.push(this.dataList.list[i]);
}
}else {
this.param = [];
}
}
}
})
</script>

checkbox绑定v-for的数据的更多相关文章

  1. TreeView树形控件递归绑定数据库里的数据

    TreeView树形控件递归绑定数据库里的数据. 第一种:性能不好 第一步:数据库中查出来的表,字段名分别为UNAME(显示名称),DID(关联数据),UTYPE(类型) 第二步:前台代码 <% ...

  2. Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据

    原文 Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据 第14部分:在运行时绑定到真实的数据 原文地址: http://channel9.msdn.com/Series/ ...

  3. vs 2015 rdlc报表绑定datagridview中的数据

    这几天一直想要实现rdlc报表绑定datagridview中的数据,始终在虚拟表向rdlc报表绑定这一步上出错.今天从下午4点到七点四十一直在尝试.最终还是实现了,最然并不知所以然,这个问题还是以后在 ...

  4. JavaScript 绑定事件时传递数据

    var data = { name: 'Ruchee', email: 'my@ruchee.com' }; data.handleEvent = function (e) { console.log ...

  5. springmvc-高级参数绑定-映射-异常-json数据交互-拦截器

    1.1. 高级参数绑定 1.1.1. 复制工程 把昨天的springmvc-web工程复制一份,作为今天开发的工程 复制工程,如下图: 粘贴并修改工程名为web2,如下图: 工程右键点击,如下图: 修 ...

  6. HTML5 Web app开发工具Kendo UI Web中如何绑定网格到远程数据

    在前面的文章中对于Kendo UI中的Grid控件的一些基础的配置和使用做了一些介绍,本文来看看如何将Kendo UI 中的Grid网格控件绑定到远程数据. 众所周知Grid网格控件是用户界面的一个重 ...

  7. My安卓知识2--使用listview绑定sqlite中的数据

    我想在我的安卓项目中实现一个这样的功能,读取sqlite数据库中的数据并显示到某个页面的listview控件中. 首先,我建立了一个Service类,来实现对数据库的各种操作,然后在这个类中添加对数据 ...

  8. 为GCD队列绑定NSObject类型上下文数据-利用__bridge_retained(transfer)转移内存管理权-备

    下面评论的好友“@Jim”给了种新的思路,就是在清除context的函数里面,用“_bridge_transfer”转换context,把context的内存管理权限重新交给ARC,这样,就不用显式调 ...

  9. php获取checkbox数组的表单数据

    提交表单的时候,对于checkbox多选框,name="field[]",此时php获取的数组为:从0开始的索引数组:如果name="field[n]" 有数字 ...

随机推荐

  1. MS SQL Server的COALESCE函数

    MS SQL Server的COALESCE函数是从一系列表达式中返回第一个NOT NULL的值. 检查[B],[Q],[S],[T],[U]的值: 检查顺序[B]->[Q]->[S]-& ...

  2. 从网络架构方面简析循环神经网络RNN

    一.前言 1.1 诞生原因 在普通的前馈神经网络(如多层感知机MLP,卷积神经网络CNN)中,每次的输入都是独立的,即网络的输出依赖且仅依赖于当前输入,与过去一段时间内网络的输出无关.但是在现实生活中 ...

  3. hihocoder1475 数组分拆【DP+前缀和优化】

    思路: DP[ i ] 代表以 i 结尾的方案数. dp[i] += sum[i] - sum[j - 1] != 0 ? dp[j] : 0 ; 对于100%的数据,满足1<=N<=10 ...

  4. hdu 5033 buiding(单调栈)

    hdu 5033 buiding(单调栈) 某年某月某天,马特去了一个小镇.这个小镇如此狭窄,以至于他可以把小镇当作一个枢纽.在镇上有一些摩天大楼,其中一栋位于xi,高度为hi.所有的摩天大楼位于不同 ...

  5. jquery 插件的实现和优化

    1.menus 实现: $.fn.menu=function(options){ var $this=$(this); var cross='<div class="zhiniu_cr ...

  6. JAVA之动态编译

    通过Java动态生成class文件 今天说下JAVA中的动态编译,这个功能根据我现在的了解好像没有见到过用的,我Jio的吧,现在的一些在线代码编缉器可以用到了,这个具体我也不是很清楚.感兴趣的大家可以 ...

  7. 用Java创建JMeter变量 - 终极指南

    了解如何在Java中创建不同类型的JMeter变量,不同变量类型的详细信息以及如何避免错误. 在Apache JMeter™中编写负载或功能测试涉及使用不同类型的变量.变量有多种用途,例如,在以下情况 ...

  8. Django (十三) 项目部署 3

    阿里云项目部署 部署Django项目   1, 配置nginx 1.1 进入:cd /var/www, 将外面压缩好的AXF项目拖入xshell中,并解压 1.2 配置nginx.conf: 将htt ...

  9. Java通过图片url地址获取图片base64位字符串的两种方式

    工作中遇到通过图片的url获取图片base64位的需求.一开始是用网上的方法,通过工具类Toolkit,虽然实现的代码比较简短,不过偶尔会遇到图片转成base64位不正确的情况,至今不知道为啥. 之后 ...

  10. 关于byte[]和字符串的转换

    public static String byteToStr(byte[] b) { return new String(b); } public static byte[] strToByte(St ...