分页

我们使用PageHelper工具：
1.maven部分:

<dependency>
  <groupId>com.github.pagehelper</groupId>
  <artifactId>pagehelper</artifactId>
  <version>4.1.0</version>
</dependency>
<!--
    spring boot框架使用pagehelper的引入包
 -->
<dependency>
      <groupId>com.github.pagehelper</groupId>
      <artifactId>pagehelper-spring-boot-starter</artifactId>
      <version>1.2.3</version>
    </dependency>

2.mapper层：

List<XXGL> checkXXGL(XXGLVO xxglvo);//查询接口

mapper.xml层：

<select id="checkXXGL" resultMap="BaseResultMapVO" parameterType="com.message.VO.XXGLVO">
    SELECT
      si.id,
      si.sample_id,
      ap.`name` AS province,
      ac.`name` AS city,
      atow.`name` AS county,
      cp.crop_category,
      si.sampling_time,
      si.input_time,
      si.pollution_rate,
      GROUP_CONCAT(sti.toxin_type) AS toxin_type
    FROM
      sample_info AS si
        LEFT JOIN sample_toxin AS sto ON sto.sample_info_id = si.id
        LEFT JOIN sample_toxin_info AS sti ON sto.toxin_id = sti.id
        LEFT JOIN address_province AS ap ON si.province = ap.`code`
        LEFT JOIN address_city AS ac ON si.city = ac.`code`
        LEFT JOIN address_town AS atow ON si.county = atow.`code`
        LEFT JOIN crop_category AS cp ON si.crop_category_id = cp.id
    <where>
      <if test="sampleId!=null and sampleId!=''">
        and si.sample_id like  concat('%',#{sampleId},'%')
      </if>
    <if test="wuranlv!=null and wuranlv!=''">
      and si.wuranlv between #{MinPollutionRate} and #{MaxPollutionRate}
    </if>
    <if test="time!=null and time!=''">
      and   si.input_time like concat('%',#{time},'%')
    </if>
      <if test="toxinId!=null and toxinId!=''">
        and #{toxinId} in (select
        GROUP_CONCAT(toxin_id)
        from
        sample_toxin
        where
        sample_info_id=si.id
        GROUP BY sample_info_id)
      </if>
      <if test="breed!=null and breed!=''">
        and si.breed=#{breed}
      </if>
      <if test="province!=null and province!=''">
        and si.province=#{province}
      </if>
      <if test="city!=null and city!=''">
        and si.city=#{city}
      </if>
      <if test="county!=null and county!=''">
        and si.county=#{county}
      </if>
    </where>
    GROUP BY si.id
  </select>

3.service层：

List<XXGL> selectXXGL(XXGLVO xxglvo);

impl层:

@Override
    public List<XXGL> selectXXGL(XXGLVO xxglvo) {
        return sampleInfoMapper.checkXXGL(xxglvo);
    }

4.controller层：

 @RequestMapping("/xxl")
    @ResponseBody
    public PageInfo<XXGL> sampleInfo(@RequestParam(value = "pageNum",defaultValue = "1",required = false) Integer pageNum, XXGLVO xxglvo){
  

        PageHelper.startPage(pageNum,5);//startoafe(一页显示多少条数据)
        List<XXGL> xxgls = sampleInfoService.selectXXGL(xxglvo);
        PageInfo<XXGL> xxglPageInfo=new PageInfo<>(xxgls);
        return xxglPageInfo;
    }

---

前端部分：
1.html部分：

<div class="page" id="page">

//初始化加载值
$(function (){
    readList(1);
}

function readList(pageNum){
    var formdata=$("#form1").serialize();//序列化 localhost：8080/xxx?ccc&&aaa
    formdata+="&pageNum="+pageNum;
    $.ajax({
      url:"/xxl",
      data:formdata,
      dataType:"json",
      type:"post",
      success:function (data){
        var samp=data.list;
        $("#tbody").empty();
        var tbody='';
        for (var i=0;i<samp.length;i++){
          tbody+='<tr>\n' +
                  '        <td><input class="testyangpin" value="'+samp[i].id+'" type="checkbox"></td>\n' +
                  '        <td class="ybbh">'+samp[i].sampleId+'</td>\n' +
                  '        <td>'+samp[i].province+samp[i].city+samp[i].county+'</td>\n' +
                  '        <td>'+samp[i].cropCategory+'</td>\n' +
                  '        <td>'+samp[i].samplingTime+'</td>\n' +
                  '        <td>'+samp[i].inputTime+'</td>\n' +
                  '        <td>'+samp[i].pollutionRate+'</td>\n' +
                  '        <td>'+samp[i].toxinType+'</td>\n' +
                  '        <td><a href="editIM.html">编辑</a> |<a href="javascript:if(confirm(\'确实要删除吗?\'))location=\'/glory/rest/iddeleteyangpin?id=754\'">删除</a></td>\n' +
                  '      </tr>';
        }
        $("#tbody").append(tbody);
        $("#pages").empty();
        var page='';
        page+= '<ul>'+
                     '<li className="im-indexpage"><a href="#" οnclick="readList('+data.firstPage+')">首页</a></li>'+
                     '<li className="im-nextpage"><a href="#" οnclick="readList('+(data.hasPreviousPage?data.prePage:1)+')">上一页</a></li>'+
                     '<li className="im-nextpage"><a href="#" οnclick="readList('+(data.hasNextPage?data.nextPage:data.pages)+')">下一页</a></li>'+
                     '<li className="im-indexpage"><a href="#" οnclick="readList('+(data.lastPage)+')">尾页</a></li>'+
              '</ul>';
        $("#pages").append(page);
      }

    })
  }