背景
在做一些后台管理系统时,表格的数据信息展示是很常见的需求,而对应的都是一些增删改查的操作
有的表格甚至要求会做拖拽,排序等
涉及到的知识
1: 如何渲染表头数据以及表格数据
2: 最右侧管理的按钮...(查看,编辑,上线,下线)是怎么插入进去的
3: 管理操作(查看,编辑,上线,下线)按钮的状态显示
4: 表格的分页数据展示
5: 表格的横向拖拽实现
操作按钮状态
它的状态是根据后端返回的具体status...具体实例效果(拖拽行)
点击文末左下方阅读原文即可体验
https://coder.itclan.cn/fontend/css/business-col-draw/
行拖拽的具体实现
这里的拖拽主要借用的是...$emit("pageCurrentChange", pageNo);
},
// 解决表格表头文字过多换行的问题
labelHead(h, { column }) {...,具体在实际的业务里,根据后端返回的数据,前端请求后端接口,就可以了的,表格的分页也在上面
反正代码很简单,一看就懂~如有不明白的,可以喊我,一起交流学习