个人博客系统（四）——分页

在个人博客系统（三）中介绍了添加博客页面和修改博客页面，这两个页面比较类似，其区别在于一个是向文章表中添加数据，一个是查询博客，修改博客。具体详情可见：http://t.csdn.cn/qwSRc

接下来，本博客主要介绍的主页及我的列表页面，由于我的列表页面比较简单，所以本博客主要介绍的是主页，主页中一个最主要的是分页功能。

1 页面功能

该页面与我的博客列表页面类似，该页面展示了所有用户的博客，但进入该页面不需要登录，即该页面为系统的首页，在该页面中，用户只能查看全文，没有修改和删除博客的功能。

2 页面的设计思路

首先，查询文章表中所有的文章，并以链表的形式返回至前端，前端按照时间的先后顺序倒排在页面中显示。并统计文章表中的文章总数，按照每页2篇博客的形式进行分页管理，然后依次实现首页、上一页、下一页和末页的功能。

3 分页功能

分页的三个关键因素：每页显示的条数、当前页码以及总页数。分页的公式

其中pagesize为每一页的博客数，pageindex为当前页码。

以下为实现首页、上一页、下一页和末页的功能的判断方法：

首页：pindex==””或pindex<=1，已在首页，不需要跳转；否则，跳转到主页，即可在首页。

上一页：pindex=parseInt(pindex)-1;location.href=”blog_list.html?pindex=”+pindex;

下一页：pindex=parseInt(pindex)+1;location.href=”blog_list.html?pindex=”+pindex;

末页：若pindex>=totalpage,已在首页，不需要跳转；否则，跳转到location.href=”blog_list.html?pindex=”+totalpage;

4 页面展示

当SpringBoot项目启动运行后，在浏览器中输入localhost:8080///blog_list.html，即可进入主页，如下图所示：

在个人中心页面中，实现头像、昵称、密码的修改，这三个可以分别进行修改，因此要分别向后端发送请求。首先判断头像、昵称、密码是否为空，如果都为空，则提示请输入要修改的内容；如果头像不为空，则向后端发送请求，若用户未登录，则提示请先登录；否则更改数据库中用户名中用户的头像的文件名；如果昵称不为空，则向后端发送请求，若用户未登录，则提示请先登录；否则更改数据库中用户名中用户的昵称；如果密码不为空，则判断原密码与确认密码是否为空，若不为空，且密码与确认密码一致，则向后端发送请求，若用户未登录，则提示请先登录；若原密码与数据库中用户的密码不一致，则提示原密码错误；否则更改数据库中用户名中用户的密码。其中重点为修改头像，具体详情可见：http://t.csdn.cn/WNTcT