layui-数据表格之行操作

前端行操作的按钮

<a class="layui-btn layui-btn-sm layui-btn-green" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-sm layui-btn-green" lay-event="del">删除</a>
           

监听数据表格行操作

table.on('tool(roles)', function(obj) {
			var data = obj.data;
			if (obj.event === 'edit') {
				layer.open({
					type : 2,
					area : [ '400px', '300px' ],
					content : '[[@{/role/editor}]]/' + data.id 
				});
			} else if (obj.event === 'del') {
				layer.confirm(`是否确定删除角色名:${data.name}`, function(index) {
					// 调用deleteById函数删除，再code==0，然后调reload刷新页面. 使用callback应该是因为返回rs;this=rs;
					deleteById(data.id, function() {
						if (this.code === 0) {
							reload();
						}
						//根据对应index关闭弹出层
						layer.close(index);
					})
				});
			}
		})
           

后端代码

//此方式可以接受/editor/{id}和/editor两种方式访问
@GetMapping(path = {"/editor/{id}","/editor"})
	public String editor(@PathVariable(required = false,name = "id")Integer id, ModelMap map) {
		//可以将Role role写在括号中，就不需要set
		Role role = new Role();
		role.setId(id);
		Role list = roleService.findOneRole(role);
		map.put("role", list);
		return "role/editor";
	}