前端开发-数据分页请求和删除

最近更新时间：2017年5月31日14:57:09

《我的博客地图》

    做前端开发的过程中，将服务器数据展现出来是常见的业务需求，这个过程中需要用到分页处理方案。本文研究的实际案例是，移动端展示用户收藏的列表项，在该列表项页面，用户可以做滑动删除操作、点击查看详情和下拉底部点击‘查看更多’。

1、数据库存储和删除数据规则

    购物网站用户中心的收藏列表，用来存储用户收藏的商品目录，以时间倒叙的方式存储在数据库中，前端请求数据库资源，服务器返回每页固定量（比如10条）数据；

    用户删除某条数据时，前端要做两件事情：

    第一，前端会发送http请求向后台服务器，服务器让数据库执行删除该条数据操作；数据库删除数据成功向前端返回成功响应，前端在删除回调函数执行下一步操作；

    第二，数据库数据删除成功，前端执行删除DOM操作，即让用户看到该条数据视觉上消失；

2、业务逻辑实现

    对于用户进入用户中心的收藏列表查看和删除收藏列表信息，是一个复杂的过程：

第一，用户首次进入收藏列表

    前端向服务器发送第一次请求，执行一次数据请求方法；请求成功展示10条数据；用户上拉页面会再次执行请求数据操作，前端向服务器发送第二次请求，执行一次数据请求方法；以此类推，直到数据全部请求结束；

第二，用户删除收藏列表操作，分两种情况：

    第一种情况，当前展示数据只是数据库部分数据；此时用户执行删除操作，或连续非跨页删除操作，或连续跨页删除操作，需要记录用户删除数据的最小页码，从而在用户再次请求数据时保证从数据库拿到的数据是重新排列的最新数据；

    第二种情况，当前展示数据是数据库全部数据；此时不需要做特殊处理，用户删除一项，向后台发送一条删除指令，前端做DOM删除即可，不需要考虑用户删除哪一项，因为此时不需要向后台发送请求数据操作；