本文实例为大家分享了Vue分页插件的前后端配置与使用，供大家参考，具体内容如下
网站建设哪家好，找创新互联！专注于网页设计、网站建设、微信开发、重庆小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了博罗免费建站欢迎大家使用！
分页插件的配置
com.github.pagehelper
pagehelper
5.1.10
com.github.pagehelper
pagehelper-spring-boot-autoconfigure
1.2.10
后端中的核心代码
1. 控制层代码
BusinessException异常是自定义的异常类型
CommonResponseUtils、ConversionUtils是自定义的工具类
以上代码在本博客均未列出
* @param commonRequest 前端请求
* @return 返回给前端的数据
*/
@PostMapping(value = "/queryByCondition")
public CommonResponse> queryByCondition(@RequestBody CommonRequest commonRequest){
CommonRequestUtils.checkCommonRequest(commonRequest);
try {
OrganizationDTO dto = (OrganizationDTO) ConversionUtils.convertSimpleObject(commonRequest.getBody(),OrganizationDTO.class);
PageInfo dtoPageInfo = organizationService.queryByCondition(dto);
List dtoList = dtoPageInfo.getList();
List vos = ConversionUtils.convertSimpleList(dtoList, OrganizationDataListVO.class);
PageInfo voPageInfo = (PageInfo) ConversionUtils.convertSimpleObject(dtoPageInfo, PageInfo.class);
voPageInfo.setList(vos);
return CommonResponseUtils.makeSuccessCommonResponse(voPageInfo, "0", null, null, null);
} catch (ServiceException exception) {
throw new BusinessException(exception);
} catch (IllegalAccessException | InstantiationException e) {
throw new BusinessException(SystemExceptionEnum.SYSTEM_ERROR);
}
}
实体类
OrganizationDataListVO
package com.bosssoft.bes.userpermission.pojo.vo;
import com.bosssoft.bes.userpermission.pojo.base.DataListVO;
import java.io.Serializable;
/**
* @author
* @date 2019-08-25 18:43
*/
public class OrganizationDataListVO extends DataListVO implements Serializable {
/**
* 机构名称
*/
protected String name;
/**
* 机构代码
*/
protected String code;
/**
* 负责人
*/
protected String master;
/**
* 电话
*/
protected String tel;
/**
* 地址
*/
protected String address;
public OrganizationDataListVO() {
}
}OrganizationQueryConditionVO
package com.bosssoft.bes.userpermission.pojo.vo;
import com.bosssoft.bes.userpermission.pojo.base.QueryConditionVO;
import java.io.Serializable;
/**
* @author
* @date 2019-08-15 14:05
*/
public class OrganizationQueryConditionVO extends QueryConditionVO implements Serializable {
/**
* 机构名称
*/
protected String name;
public OrganizationQueryConditionVO() {
}
}2. 业务层代码
/**
*
* @param organizationDTO
* @return
* @throws ServiceException
*/
public PageInfo queryByCondition(OrganizationDTO organizationDTO) {
Condition condition = new Condition(Organization.class);
Example.Criteria criteria = condition.createCriteria();
if (!StringUtils.isEmpty(organizationDTO.getName())) {
criteria.andLike("name", organizationDTO.getName() + "%");
}
condition.setOrderByClause("updated_time DESC");
PageHelper.startPage(organizationDTO.getPageNum(), organizationDTO.getPageSize());
List results = organizationDao.selectByExample(condition);
PageInfo organizationPageInfo = new PageInfo(results);
List dtos = null;
OrganizationDTO dto = null;
dtos = new ArrayList(results.size());
for (Organization result : results) {
dto = new OrganizationDTO();
BeanUtils.copyProperties(result, dto);
dtos.add(dto);
}
PageInfo organizationDtoPageInfo = new PageInfo();
BeanUtils.copyProperties(organizationPageInfo, organizationDtoPageInfo);
organizationDtoPageInfo.setList(dtos);
return organizationDtoPageInfo;
}
实体类
OrganizationDTO
package com.bosssoft.bes.userpermission.pojo.dto;
import com.bosssoft.bes.userpermission.pojo.base.BaseDTO;
import java.util.List;
/**
* @author
* @date 2019-08-15 14:09
*/
public class OrganizationDTO extends BaseDTO {
/**
* 所含公司列表
*/
protected List companyDtoList;
/**
* 机构名称
*/
protected String name;
/**
* 机构代码
*/
protected String code;
/**
* 负责人
*/
protected String master;
/**
* 电话
*/
protected String tel;
/**
* 地址
*/
protected String address;
public OrganizationDTO() {
}
}Organization
package com.bosssoft.bes.userpermission.pojo.entity;
import com.bosssoft.bes.userpermission.pojo.base.BaseEntity;
import org.springframework.stereotype.Repository;
import javax.persistence.Table;
import java.io.Serializable;
/**
* @author
* @date 2019-08-15 10:49
*/
@Repository
@Table(name = "t_organization")
public class Organization extends BaseEntity implements Serializable {
//private static final long serialVersionUID = 1L;
/**
* 机构名称
*/
protected String name;
/**
* 机构代码
*/
protected String code;
/**
* 负责人
*/
protected String master;
/**
* 电话
*/
protected String tel;
/**
* 地址
*/
protected String address;
public Organization() {
}
}3. DAO层
引用了通用mapper
前端中的代码
导入element分页插件
handleSizeChange：当改变每页显示的数据量时，触发该函数，页面刷新，并跳转到第一页。
handleCurrentChange：跳转到用户所选择的页面
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持创新互联。
网页题目：Vue分页插件的前后端配置与使用
文章出自：
http://cdysf.com/article/gshpho.html
