SSM+layui+PageHelper实现分页查询

青旅半醒 2023-07-15 08:46 46阅读 0赞

# 一. 问题背景 #

需要实现的效果如下：点击每一页，就能查询到每一页的数据  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70]

# 二. 解决方案 #

这里先给出本项目的所有依赖包：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70 1]

*  首先需要导入PageHelper的jar包、还有它的依赖包JSqlparse的jar包。  
    这两个jar包基本都在外网，所以这里上传到云盘，有需要的可下载。  
    **链接：https://pan.baidu.com/s/1LwkGh9l704-hDtRUa1glDA  
    提取码：5jj8**
 *  导入上面的两个jar包后，在mybatis-config.xml配置插件的信息，如下：  
    要注意配置信息的位置，是有严格要求的，如下图：  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70 2]  
    下面贴出代码供大家复制粘贴

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

*  这里直接给出最关键的代码，其中最最最关键的是  
    `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映射文件）

<select id="selectAllUsers" resultType="com.androidla.ssm.beans.User">
    	     select user_id, username, password, mail, manager from up_user
    	</select>

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

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70]: /images/20230528/2daec1c525b44512bd8d1013f2e50896.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70 1]: /images/20230528/5793ea128e7745c7b232e0cee30f6438.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwNjM0ODQ2_size_16_color_FFFFFF_t_70 2]: /images/20230528/3be294fd7bbe4cee831ccfe34f5220ea.png