关于elment ui 表格复选框注意事项 数据查询重复数据等解决办法

第一点: 表格定义校验规则
:model=“formData” 校验表格数据 不加这个就算校验通过输入框也会爆红
:rules=“rules” rules类似一个引用 在data里面定义一个rules集合放校验规则
类似于以下:
rules: {//校验规则
username: [{ required: true, message: ‘用户名为必填项’, trigger: ‘blur’ }],
},
并且在标签体中还要绑定标签元素 prop=“telephone” 标签元素内容对应校验规则中的名字
第二点: 关于前端发送请求出现 400 415
可能是请求数据类型和接收的数据类型不一致导致, 注意发送单个数据时,
controller层接收 不用requestbody 不然可能出现400 415,请求数据和接收数据
不一致等情况!
第三点:关于自定义表头template模板的使用
slot-scope=“scope”
slot=“header” //指定是表头 放在表格中不会与下面模板冲突
第四点:关于复选框的注意事项
当我们在使用el-checkbox 时有时是放在表格中 而表格头要和下面选择显示不一样 类似:类似第五点要求 要求表头显示和下面不一样, 这种已selection 无法满足要求
所有在这里我用两个模板 上面一个指定表头 用于批量删除,下面模板用于数据 展示选择框, 关于上面显示一个横杠并且选中 依赖于 indeterminate 关键字
并且复选框中定义的 @change可以指定多选框改变是执行的方法,而scpoe.row
表示当前选中的行数据
第五点:关于前端数据的保存
有时我们在前端页面需要保存数据,而前端数据保存不想后台数组使用的add,而是push添加数据
第六点:复选框中的状态指定和数据获取
我是在每个数据中加一个check属性,指定值为false,给复选框绑定一个change事件,每当事件触发的时候获取当前行的数据,把里面的check属性取反 即 !row.check , 当点击提交数据,发送请求的时候,给遍历的数据集合,进行遍历,
类似: this.dataList.forEach(item => {
if (item.check){
this.currentSelectItem.push(item)
}
});
把符合要求check=true的数据存入集合中
第七点:关于sql 多表查询怎么规避重复数据
多表查询规避重复数据 可以试一下 group by 和 inner join 等规避
而单表查询则使用distinct 排除重复数据
查询除某些字段之外的数据使用 not in not like 等关键字
————————————————
版权声明：本文为CSDN博主「G_zhenyan」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/G_zhenyan/article/details/104263997