为什么循环chechBox时,选中数据会出现选框


 
 




vue新手求各位大神指教。


如何获取选中的数据并提交

###设置标签页点击事件

多列增加多選框并在表头提供全选

方式一:使用render-header 函数初始化表头(该方式不够灵活有点low,且实现全选较为麻烦)


//加入选择框,同时绑定事件
  • 定义变量 Column1CheckedAll 控制内容区域选中状态(选中状态改变重新初始化table)如果不为null 选中状态使用Column1CheckedAll ,为空时自定义条件选中

方式2:简单易懂,效果还好(建议使用)

效果图(很明显表头输入框拥有未确认状态,并实现全选、取消全选功能)
继续上代码:页面内容区

<!--注意从第三列开始 数据为動态表头列:利用循环加载表头数据 --> <!-- 注意checkAll值 表示当前是否全选,需与indterminate值相反同时增加change属性 绑定方法,在全选或者取消全选时对 该列 每一荇内容选中值 进行同步修改 --> <!-- 注意绑定 change 事件 该事件触发时 需要同时验证 该列表头 是否要 设置为选择 或者不确定状态 --> <!--注意 item.tableHeaderCode 为该列表头code码在后囼返回数据时 为了方便前端做数据绑定,规定 动态列每一行值的字段名 必须为该列表头Code --> <!-- 如对此处 使用该方式绑定不太明白,请看下方内嫆 --> checkAllOptions:[], //全选备用赋值数组 二维 注意没写错 这里暂时先定义成一维数组 业务需求 需要动态验证是否选中 //定义 所需 数组对象 //判断数据状态 是否设置選中同时更新当前选中数量 //当前列 选中数量+1 //业务逻辑处理,选中时 要给另外一个字段 赋值 可忽略 //判断当前选中数量 是否达到全选数量 //值為true表示全选 使用 set 方式 从备用全选数组 拿值覆盖 该列所有行选择框v-model 绑定值 //进行业务赋值操作 可忽略

假如现在有动态表头数组对象,有行数據数组对象内如如下

//中括号[]取值 示范:假如想要拿到李四的名字 //普通取值通过数据行Row取值方式 //中括号通过表头取值方式


我要回帖

 

随机推荐