回想一个前后端分离的项目,尤其是类似OA这样的管理平台,我们会发现当中最多的就是列表页,列表页在负责数据的展示的同时也为数据的曾删改提供了必要的抓手,所以,我们来聊聊一个完整的列表页需要具备的功能:
列表页功能
大部分的列表页是类似的,以一个类似excel的二维表的形式出现,第一行是表头,下面是数据,但是除了这样的基本功能外,一般还有几个功能。
分页
分页功能是大部分的列表页都有的功能,目的很简单但也很必要:减少没有必要的查询,降低服务器压力的同时提高用户的体验感,一般情况下列表页很少有一次性查看所有数据的需求的需求,你可以设想一下一个列表页在加载了2秒之后,返回了10万条数据给你,那个时候.....
分页在实现的过程当中,常见的有两种思路:
1、页码截取类型的分页,这个类型的分页需要前端传递页码(page),和每页的数据条数(page_size),返回的数据是:
(page-1)*page_size : page*page_size
2、偏移量分页,这类型的分页在后端结合类似mysql的offset,limit来实现,前端只需要传递从那条开始查(pn),查多少条(rn),返回的数据是:
pn : pn+rn
数据操作
同样的数据操作也是列表页的基础功能,他基于列表页可以进行每条数据的具体操作,通常可能有:
1、查看详情
2、修改数据(修改数据还可能分为修改数据状态和修改数据内容)
3、删除数据(通常这里会是逻辑删除,但也有物理删除或者二者都在的情况)
4、新增数据,这个功能一般放在列表页的右上方,不包含再数据当中,当然如果是新增关联数据的话,入口可能在列表页的数据当中。
在数据操作的过程当中,基于前端需要注意的就是数据的刷新,首先,在修改,删除,新增功能提交数据,执行返回后,需要根据返回刷新列表页,其次在新增和修改功能触发后,刷新提交数据的表单,这些都是很有必要的。
数据筛选过滤
基于列表页,为了提升用户体验,很有效的办法就是加数据过滤,常见的有:
1、数据查询,使用模糊匹配以列表当中数据的一个或者多个关键字段作为依据,进行数据查询。
2、数据排序,基于整个列表数据,按照时间,数字,名称或者其他排序字段进行正序和倒序。
3、条件过滤,基于列表数据,进行时间范围和其他值的过滤。
数据筛选对于后端来说,通常就是接收get请求传递的筛选条件,然后进行sql的拼接,但是基于前端比较烧脑的是,前后查询条件的状态保持,比如,在查询所有性别为男的学员的第二页再次发起查询性别为女的查询,页码需要重置,但是再查询性别为男第二页数据当中修改了一个学员的专业,那么这个时候是保持排序,再第二页刷新数据还是让这条数据返回到第一页,这个就是一个需要考虑的问题了。
数据的导入导出
随着项目数据的规模越来越大和系统间数据使用的交互,所以出现了导入excel或者其他文件格式的数据到列表页或者是将列表页导出成指定文件格式的文件。
前后端交互
列表页大部分的前后端交互是以GET请求来进行的,只有修改,新增,删除可能采用其他的请求方式,对于前端传递参数来说,列表页容易产生很多参数,所以要注意参数的拼接格式。而后端来说,如何高效的返回列表页需要的数据是一个很重要的问题。
当然这些只是对列表页的一点个人总结,欢迎各位大佬多多指点。