SSM+layui+PageHelper实现分页查询

一. 问题背景

需要实现的效果如下:点击每一页,就能查询到每一页的数据
在这里插入图片描述

二. 解决方案

  • 首先需要导入PageHelper的jar包、还有它的依赖包JSqlparse的jar包。
    这两个jar包基本都在外网,所以这里上传到云盘,有需要的可下载
    链接:https://pan.baidu.com/s/1LwkGh9l704-hDtRUa1glDA
    提取码:5jj8

  • 导入上面的两个jar包后,在mybatis-config.xml配置插件的信息,如下:
    要注意配置信息的位置,是有严格要求的,如下图:
    在这里插入图片描述
    下面贴出代码供大家复制粘贴

<configuration>
     <!--
	    plugins在配置文件中的位置必须符合要求,否则会报错,顺序如下:
	    properties?, settings?,
	    typeAliases?, typeHandlers?,
	    objectFactory?,objectWrapperFactory?,
	    plugins?,
	    environments?, databaseIdProvider?, mappers?
     -->
		<plugins>
		    <!-- com.github.pagehelper为PageHelper类所在包名 -->
		    <plugin interceptor="com.github.pagehelper.PageInterceptor">
		        <!-- 使用下面的方式配置参数,后面会有所有的参数介绍 -->
		        <property name="reasonable" value="true"/>
			</plugin>
		</plugins>
</configuration>

环境搭建好了就开始贴出逻辑代码了。

  • 这里直接给出最关键的代码,其中最最最关键的是
    map.put("data", userPageInfo.getList());, 方法返回的数据必须是json格式,所以方法上面必须加@ResponseBody
    ,如下:

UserHandler.java (Controller层)

/**
	 * 分页查询方法
	 * @param page
	 * @param limit
	 * @return
	 */
	@ResponseBody //自动返回json格式的数据
	@RequestMapping(value="/getPage",method=RequestMethod.GET)
	public Map<String, Object> getPage(@RequestParam("page")Integer page, 
			@RequestParam("limit")Integer limit){//page、limit参数都是layui的table组件默认自动传递的,我们只需接收即可
		Map<String, Object> map = new HashMap<String, Object>();
		List<User> list = userService.getUserPage(page, limit);//执行分页查询的方法
		PageInfo<User> userPageInfo = new PageInfo<User>(list);
		System.out.println("list的内容为:" + list.get(2));
		System.out.println("pageInfo的内容为:" + userPageInfo.getTotal());
		map.put("code", 0);
		map.put("msg", "操作成功");
		map.put("count", userPageInfo.getTotal());
		map.put("data", userPageInfo.getList());//最最最关键的代码,layui的table会自动获取并显示该数据集
		return map;
	}

解释:
上面代码中的

        map.put("code", 0);
		map.put("msg", "操作成功");
		map.put("count", userPageInfo.getTotal());
		map.put("data", userPageInfo.getList());

非常关键,这是layui必须要求的接口格式。code,msg,count,data,都不要改。

  • layui的table代码,如下:
table.render({
    	    elem: '#demo'
    	    ,id: 'demoId'
    	    /* ,url: '/UsedProduct/getAllUsers' //数据接口 */
    	    ,url: '/UsedProduct/getPage' //数据接口
    	    ,type: 'GET'
    	    ,page: true //开启分页
    	    ,skin: 'row'
    	    ,toolbar: 'default' //开启头部工具栏,并为其绑定左侧模板
    	    ,cellMinWidth: 80//全局定义常规单元格的最小宽度,layui 2.2.1 新增
    	    ,cols: [[ //表头
    	      {type:'checkbox'}
    	      ,{field: 'user_id', title: 'ID', sort: true, align: 'center', width: '5%'}
    	      ,{field: 'username', title: '用户名', align: 'center'}
    	      ,{field: 'password', title: '密码', align: 'center'}
    	      ,{field: 'mail', title: '邮箱', align: 'center'} 
    	      ,{field: 'manager', title: '是否为管理员', align: 'center'}
    	      ,{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}
    	    ]]
    	  });

解释: 只要Controller返回的数据严格按照上面的code,msg,count,data格式,那么table的代码无需加入parseData或done

UserService.java (Service层)如下:

package com.androidla.ssm.service;

import java.util.List;

import com.androidla.ssm.beans.User;
import com.github.pagehelper.PageInfo;

public interface UserService {
	public List<User> getUserPage(Integer page, Integer limit);
}

下面代码的最最最关键是PageHelper.startPage(page, limit);后面的第一个对数据库操作的方法,将自动进行分页,sql语句无需添加limit关键字,如下:
UserServiceImpl.java (Service实现层)

package com.androidla.ssm.service.impl;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.androidla.ssm.beans.User;
import com.androidla.ssm.mapper.UserMapper;
import com.androidla.ssm.service.UserService;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;

@Service
public class UserServiceImpl implements UserService{

	@Autowired
	private UserMapper userMapper;
	
	@Override
	public List<User> getUserPage(Integer page, Integer limit) {
		// TODO Auto-generated method stub
		//使用PageHelper.startPage静态方法调用
		//startPage后面的第一个对数据库操作的方法,将自动进行分页,sql语句无需添加limit关键字
		PageHelper.startPage(page, limit);//page为申请查询的页码,limit为一页显示多少条数据
		List<User> users = userMapper.selectAllUsers();//PageHelper.startPage()后面必须紧接查询数据的方法
		return users;
	}
}

UserMapper.java (Mapper层,即常说的DAO层)

package com.androidla.ssm.mapper;

import java.util.List;

import org.apache.ibatis.annotations.Param;

import com.androidla.ssm.beans.User;

public interface UserMapper {
    public List<User> selectAllUsers();
}

UserMapper.xml (Mapper映射文件)

<!-- public List<User> selectAllUsers(); -->
	<select id="selectAllUsers" resultType="com.androidla.ssm.beans.User">
	     select user_id, username, password, mail, manager from up_user
	</select>

最后如果有遇到问题欢迎留言

发布了345 篇原创文章 · 获赞 20 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/qq_40634846/article/details/104885685