element 循环动态Checkbox 多选框

最新推荐文章于 2024-07-04 18:16:19 发布
最新推荐文章于 2024-07-04 18:16:19 发布
阅读量4.6k 收藏 21
点赞数 5
分类专栏： element vue 文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiaoHelloWord/article/details/117567802
版权
vue 同时被 2 个专栏收录
26 篇文章 1 订阅
订阅专栏
element
14 篇文章 1 订阅
订阅专栏

直接放图，这里做的是权限控制
在这里插入图片描述

<table width="100%">
	<tbody>
			<tr v-for="(permissionTop,topIndex) in tableData" :key="topIndex">
				<th style="line-height:48px;border:1px solid #1E9FFF;padding:0 10px;width: 150px;">
					
					<el-checkbox :indeterminate="permissionTop.indeterminate" 
					:key="topIndex" v-model="permissionTop.mychecked"
					 :label="permissionTop.id" 
					 @change="onChangeTop(topIndex, permissionTop.id, $event)">
					 {{permissionTop.name}}</el-checkbox>
				</th>
				<td style="border:1px solid #1E9FFF;padding:0 10px">
					
					<el-checkbox-group  v-model="checkedCities">
						<el-checkbox
						v-model="permissionSon.mychecked"
						
						v-for="permissionSon in permissionTop.dataList" :key="permissionSon.id"
						 @change="onChangeSon(topIndex, permissionSon.id, permissionTop.id, $event)"
						 :label="permissionSon.id" >{{permissionSon.name}}</el-checkbox>
					 </el-checkbox-group>
				</td>
			</tr>
		</tbody>
	</table>

onChangeTop(index, topId, e) { //父级change事件
				let that = this
				that.tableData[index].mychecked = e //父级勾选后，子级全部勾选或者取消
				if (e == false) that.tableData[index].indeterminate = false //去掉不确定状态
				
				var childrenArray = that.tableData[index].dataList //这里注意是选取一级下的二级数据
				var	len = childrenArray.length;
				if (that.tableData[index].mychecked == true){
					// 点击全选往v-model添加选中的id
					for (var i = 0;  i < childrenArray.length; i++)
						that.checkedCities.push(childrenArray[i].id)
				}else{
					//取消全选删除重复的id
					that.checkedCities = that.checkedCities.filter(item => !childrenArray.some(ele=>ele.id===item));
					
				}
			},
			onChangeSon(topIndex, sonId, topId, e) { //子级change事件
				let that = this
				var childrenArray = that.tableData[topIndex].dataList//这里注意是选取一级下的二级数据
				var tickCount = 0,
					unTickCount = 0,
					len = childrenArray.length
				console.log(childrenArray)
				for (var i = 0; i < len; i++) {
					if (sonId == childrenArray[i].id) childrenArray[i].mychecked = e
					if (childrenArray[i].mychecked == true) tickCount++
					if (childrenArray[i].mychecked == false) unTickCount++
					
				}
				if (tickCount == len) { //子级全勾选
					that.tableData[topIndex].mychecked = true
					that.tableData[topIndex].indeterminate = false
				} else if (unTickCount == len) { //子级全不勾选
					that.tableData[topIndex].mychecked = false
					that.tableData[topIndex].indeterminate = false
				} else {
					that.tableData[topIndex].mychecked = true
					that.tableData[topIndex].indeterminate = true //添加不确定状态
				}
			},

数据格式

{
    "data":[
        {
            "id":1,
            "name":"角色管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":1,
                    "typeID":1,
                    "name":"角色查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":2,
                    "typeID":1,
                    "name":"新增角色",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":3,
                    "typeID":1,
                    "name":"删除角色",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":4,
                    "typeID":1,
                    "name":"权限设置",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":12,
                    "typeID":1,
                    "name":"导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":2,
            "name":"员工管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":5,
                    "typeID":2,
                    "name":"员工查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":6,
                    "typeID":2,
                    "name":"添加员工",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":8,
                    "typeID":2,
                    "name":"删除员工",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":9,
                    "typeID":2,
                    "name":"登录限制",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":10,
                    "typeID":2,
                    "name":"修改密码",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":11,
                    "typeID":2,
                    "name":"导出数据",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":78,
                    "typeID":2,
                    "name":"导入员工",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":3,
            "name":"员工穿着",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":13,
                    "typeID":3,
                    "name":"穿着查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":14,
                    "typeID":3,
                    "name":"添加穿着",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":16,
                    "typeID":3,
                    "name":"删除穿着",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":18,
                    "typeID":3,
                    "name":"批量导入",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":19,
                    "typeID":3,
                    "name":"批量导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":4,
            "name":"员工终端",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":20,
                    "typeID":4,
                    "name":"终端查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":21,
                    "typeID":4,
                    "name":"添加终端",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":22,
                    "typeID":4,
                    "name":"删除终端",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":23,
                    "typeID":4,
                    "name":"终端启用",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":24,
                    "typeID":4,
                    "name":"批量导入",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":25,
                    "typeID":4,
                    "name":"批量导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":5,
            "name":"员工奖惩",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":26,
                    "typeID":5,
                    "name":"奖惩查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":6,
            "name":"排班管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":27,
                    "typeID":6,
                    "name":"排班查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":28,
                    "typeID":6,
                    "name":"添加排班",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":29,
                    "typeID":6,
                    "name":"排班导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":79,
                    "typeID":6,
                    "name":"删除排班",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":7,
            "name":"考勤管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":30,
                    "typeID":7,
                    "name":"打卡记录",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":31,
                    "typeID":7,
                    "name":"统计分析",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":32,
                    "typeID":7,
                    "name":"请假记录",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":8,
            "name":"车辆类别",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":33,
                    "typeID":8,
                    "name":"类别查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":34,
                    "typeID":8,
                    "name":"添加类别",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":35,
                    "typeID":8,
                    "name":"删除类别",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":36,
                    "typeID":8,
                    "name":"类别启用",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":9,
            "name":"车辆信息",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":37,
                    "typeID":9,
                    "name":"车辆查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":38,
                    "typeID":9,
                    "name":"添加车辆",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":39,
                    "typeID":9,
                    "name":"删除车辆",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":41,
                    "typeID":9,
                    "name":"车辆导入",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":42,
                    "typeID":9,
                    "name":"车辆导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":10,
            "name":"车辆异常统计",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":43,
                    "typeID":10,
                    "name":"异常查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":44,
                    "typeID":10,
                    "name":"删除",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":45,
                    "typeID":10,
                    "name":"处理",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":11,
            "name":"车辆费用",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":46,
                    "typeID":11,
                    "name":"费用分析",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":47,
                    "typeID":11,
                    "name":"费用统计",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":48,
                    "typeID":11,
                    "name":"分析导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":49,
                    "typeID":11,
                    "name":"统计导出",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":12,
            "name":"用油管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":50,
                    "typeID":12,
                    "name":"用油查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":51,
                    "typeID":12,
                    "name":"添加用油",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":52,
                    "typeID":12,
                    "name":"导入用油",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":53,
                    "typeID":12,
                    "name":"导出用油",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":77,
                    "typeID":12,
                    "name":"删除用油",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":13,
            "name":"维保管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":54,
                    "typeID":13,
                    "name":"维保查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":55,
                    "typeID":13,
                    "name":"添加维保",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":56,
                    "typeID":13,
                    "name":"删除维保",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":57,
                    "typeID":13,
                    "name":"导出维保",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":58,
                    "typeID":13,
                    "name":"维保提醒",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":59,
                    "typeID":13,
                    "name":"统计分析",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":14,
            "name":"保险管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":60,
                    "typeID":14,
                    "name":"保险查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":61,
                    "typeID":14,
                    "name":"添加保险",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":62,
                    "typeID":14,
                    "name":"删除保险",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":63,
                    "typeID":14,
                    "name":"导出保险",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":64,
                    "typeID":14,
                    "name":"保险提醒",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":15,
            "name":"年检管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":65,
                    "typeID":15,
                    "name":"年检查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":66,
                    "typeID":15,
                    "name":"添加年检",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":67,
                    "typeID":15,
                    "name":"删除年检",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":68,
                    "typeID":15,
                    "name":"导入年检",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":70,
                    "typeID":15,
                    "name":"导出年检",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":71,
                    "typeID":15,
                    "name":"年检提醒",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        },
        {
            "id":16,
            "name":"违规管理",
            "remark":"",
            "mychecked":false,
            "indeterminate":false,
            "dataList":[
                {
                    "id":72,
                    "typeID":16,
                    "name":"违规查询",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":73,
                    "typeID":16,
                    "name":"添加违规",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":74,
                    "typeID":16,
                    "name":"删除违规",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":75,
                    "typeID":16,
                    "name":"导入违规",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                },
                {
                    "id":76,
                    "typeID":16,
                    "name":"导出违规",
                    "remark":"",
                    "mychecked":false,
                    "indeterminate":false
                }
            ]
        }
    ],
    "state":10001,
    "msg":"ok",
    "code":0,
    "count":0,
    "extraParams":null
}
真的不想哇
关注
  • 5
    点赞
  • 踩
  • 21
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
动态生成多个el-checkbox-group,控制每组的单选全选
大哼的小世界
04-05 5213
效果图如下： template部分 <div class="all_company" id="all_company" ref="all_company"> <div class="industry_item" v-for="(item,index) in companyArr" :key="index"> <div @click="checkAllchange(index)"> <el-checkbox
element 实现多个循环出来的复选框，以及回显
wqnmlgbsz的博客
09-11 5566
1.效果图如上 下面是demo1，点击aaaa 所有rule里面的链接 放到一个数组里面 <style scoped> </style> <template> <el-form label-width="200px"> <el-button @click="aa">点击我打印结果</el-button> <el-form-item v-for="item in ci...
ElementUI 遍历实现checkbox组件的多选全选功能
最新发布
2401_85158651的博客
07-04 439
【代码】ElementUI 遍历实现checkbox组件的多选全选功能。
vue中循环多组checkbox-group
m0_57442975的博客
10-12 5551
1.因为官网给出的checkbox group绑定的数据格式是数组，而在项目中接收的数据通常是对象数组，我这里label绑定的是数组中对象的id属性，点击获取的是id的数组，在最后提交数据时需要做处理。2.一开始也尝试了label绑定整个对象，这样获取到的直接便是最终需要的对象数组，展示和添加是可以实现的，但是回显遇到了问题，在网上看是回显的数据格式要与选中的数组中对象的格式一致，尝试了没有效果，后面再研究一下。
for循环el-checkbox实现类似于el-collapse的折叠效果
m0_49529959的博客
12-03 2461
1.需要实现的功能 1.1可以实现多选操作，点击label文字/多选框实现多选操作，点击（点击可展开预览/收起）实现多选条件
vue+element 循环多组 checkbox实现
老菜鸟ios学习足迹
01-11 914
【代码】vue+element 循环多组 checkbox实现。
element 动态多选框
qq_32184753的博客
11-19 1044
<el-checkbox-group v-model="riRate"> <el-checkbox v-for="(item, index) in riRateContent" :key="index" :label="item.value" >{{item.label}}</el-checkbox> </el-checkbox-group> export default { return { riRate.
checkbox 复选框不能为空
09-05
在网页表单设计中，`checkbox`（复选框）是一种常见的用户输入方式，它允许用户从多个选项中选择一个或多个。在某些场景下，系统可能会要求用户至少选择一个选项，以确保他们已阅读并同意某项条款或选择了必要的服务...
vue基于element-ui的三级CheckBox复选框功能的实现代码
10-17
在现代Web开发中，复选框（Checkbox）组件是用来实现用户界面中多选功能的常见元素。尤其在使用Vue.js框架开发时，element-ui库提供了一套丰富的UI组件，其中包括Checkbox。但是，在某些业务场景中，需要实现多层...
jQuery实现获取多选框的值示例
10-15
在本示例中，我们将详细探讨如何使用jQuery来获取多选框（checkbox）的值，同时了解相关的jQuery事件响应和页面元素属性获取方法。 首先，我们需要了解jQuery的选择器。在jQuery中，`$`符号是库的主入口点，用于...
循环动态判断checkbox是否被选中
04-05
### 循环动态判断Checkbox是否被选中 在ASP.NET Web应用程序开发中，尤其是在使用C#作为后端语言时，动态地判断一个或多个`Checkbox`控件的状态是非常常见的需求。这种需求通常出现在表单验证、用户选项设置等功能...
详解element-ui表格中勾选checkbox，高亮当前行
10-16
本文主要介绍了在使用Element UI库进行Web开发时，如何实现一个表格组件中勾选复选框并高亮当前行的功能。通过详细分析，读者可以了解到在后台管理系统中常见的一种表格操作需求，并且提供了解决这一问题的思路和...
vue 快速入门指南(一)
郑龙飞
12-09 705
忆君心似西江水，日夜东流无歇时。前言先聊一下前端开发模式的发展。静态页面最初的网页以HTML为主，是纯静态的网页。网页是只读的，信息流只能从服务端到客户端单向流通。开发人员也只关心页面的...
Vue3.0发布了，来带你看看变化
一再问究竟的博客
09-22 420
vue2.0 vs vue3.0 1.重构响应式系统，使用Proxy替换Object.defineProperty，使用Proxy优势： （1）可直接监听数组类型的数据变化 （2）监听的目标为对象本身，不需要像Object.defineProperty一样遍历每个属性，有一定的性能提升 （3）可拦截apply、ownKeys、has等13种方法，而Object.defineProperty不行 （4）直接实现对象属性的新增/删除 2.新增Composition API，更好的逻辑复用和代码组织 3.重构 V
vue for 循环element ui 多选按钮组 el-checkbox-group ，单选按钮el-radio-group，输入框el-input，绑定值重复问题
qq_40247562的博客
07-18 8854
前言：最近在做项目，有个做题的需求，分别有单选题，多选题，问答题，三种题型。因为题的数量不确定，所以肯定是for 循环每一道题，完了之后发现有问题； 问题： for循环之后，就会发现，这三种组件（el-checkbox-group，el-radio-group，el-input）以下简称组件。都是只绑定一个变量，来获取当前的值，所以for循环之后绑定的值是一样的，导致出现bug；例如下面的v...
vue 循环勾选框_Vue学习笔记-遍历el-checkbox
weixin_34551660的博客
01-13 3911
Vue学习笔记-遍历el-checkoutv-model="checkAll":label="list.eventtypeid">全选:label="operate.actionid":key="operate.actionid"@change="handleCheckedCitiesChange">{{operate.actionname}}看上面的例子，都是把el-checkbox...
vue+elementui 动态获取数据 遍历循环 生成el-checkbox-group
热门推荐
chenacxz的博客
11-29 4万+
实际效果，参照了http://www.cnblogs.com/wjunwei/p/9531322.html 数据库存表方式和单选一样 <el-card class="boxs-card"> <div slot="header" class="clearfix"> <span>多选题<...
vue中使用Checkbox 多选框循环遍历
weixin_43549979的博客
08-20 1万+
首先效果展示 步骤如下： 1、html <el-form> <el-form-item v-for="(item, index) in dataList" :key="index"> <el-checkbox @change="(val) => handleCheckAllListChange(val, item)" :indeterminate="itemIndet
el-table的expand下动态生成el-checkbox的动态model
qq_41022291的博客
03-31 338
上图看成品 多个checkbox，这时候绑定的v-model就有问题 思路创建一个对象，动态的给里面添加数组 在data中定义一个 chooseBox:{}, 然后写入方法 for(let item in this.systemList){ this.$set(this.chooseBox, item, []) } 通过点击行+checkbox就可以绑定上当前点开的值了 ...
elementui循环复选框，并校验
05-10
假设你有一个包含多个复选框的表单，你可以使用 Element UI 的 el-checkbox 组件来实现。要对这些复选框进行校验，可以使用 Element UI 的表单验证功能。 以下是一个示例，展示如何循环渲染复选框并对它们进行校验...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值