本文实例为大家分享了某视频剪辑软件实现表格批量审核功能的具体代码，供大家参考，具体内容如下

一前端部分

效果如下图所示：

1.1 html部分

El-form-item El-button type=' success ' icon=' El-icon-search ' @ click=' auditServer()' : disabled=' this。塞尔斯。长度===0 '批量审核/El-button El-button @ click=“切换选择()”取消选择/El-按钮/El-表格-项目/br El-表格边框： fit=' true ' ref=' multiple table ' height=' 520 ' : data=' listData ' : highlight-current-row=' true ' size=' small ' @ sel-change=' sels change ' @ row-click=' handleChange ' El-table-column type=' selection ' width=' 55 '/El-table-column El-table-column prop=' applcd ' label='微服务编码显示-溢出-工具提示宽度=' 130像素'可排序固定='左'/El-table-column El-table-column prop=' servcd ' label='服务编码显示-溢出-工具提示宽度=' 130像素'可排序固定='左'/El-table-column/El-table代码说明：

1)为桌子添加属性

@ selection-change=' selsChange ' @ row-click=' handleChange ' 2)添加一列指定类型为选择，表示该表格可选择

El-表格-列类型='选择'宽度=' 55 '/El-table-第3列)当没有选择服务时，按钮不可选；

:禁用='这。塞尔斯。长度===0 ' 1.2 js部分

导出默认值{ data () { return { sels:[]，methods : { sels change(sels){ this。sels=sels }，handleChange(行，事件，列){这个.参考文献。多重表。ToggleRowSelection(row)}，AudItSERVER(){ var servids=this。塞尔斯。地图(物品=物品。服务).join('，')var params={ server ids 3360 service ds }调试器审计服务器(参数).然后（函数(res)调试器if(res.code===200){ this .$message({ message: res.data，键入： ' success ' })这。dialogformvisible=false } else { this .$message({ message: '错误信息：' res.message，键入： ' error ' })；} this.loadData() } .bind(this) ) }，toggleSelection(){ this .参考文献。多重表。clearselection()；} }}2 后端部分

2.1 mapper.xml

批量修改的框架实现方式，注意结构化查询语言语句的书写

！-审核服务信息-update id=' auditServers '参数TYPe=' Java。乌提尔。列表' update sdcp _ server SET ISAUDITED=' 1 '其中为每一个集合中的servid=' list ' index=' index ' item=' item '分隔符='，' open='(' close=')' #{item，JDBCTYPe=VARCHAR }/foreach/update 2.2映射器。Java(对应的接口)

内部审计服务器（列表字符串服务);2.3控制器

/* * * @描述：批量审核服务信息* @param @param映射* @ param @ return * @ param @抛出异常参数* @返回对象返回类型*/@RequestMapping(值='/auditServers '，方法=RequestMethod .开机自检)公共对象审核服务器(@RequestBody映射字符串，对象映射)引发异常{ if (map.get('serverIds ')！=null){ 0字符串服务器标识=(字符串)映射。' get('服务器标识');列表字符串id=数组。aslist(服务器标识)。split('，')；apiservermapper。审核服务器(id)；}返回ResponseData.success('服务信息修改成功');}以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。