分页插件:PageHelper+BootStrap+Vue+axios实现分页功能
创始人
2024-06-02 17:56:21
0

本教程需要有MyBatisPlus基础,学习MyBatisPlus请参考
SpringBoot第 14 讲:SpringBoot+MyBatisPlus

案例效果

在这里插入图片描述

技术栈

后端技术:SpringBoot2.7.9、MyBatisPlus3.5.1、MySQL8
前端技术:Vue2.5.16+axios、BootStrap3.3.7

一、后端开发

1.1、配置MyBatisPlus

1.1.1、在pom.xml中添加依赖

		org.springframework.bootspring-boot-starter-webcom.baomidoumybatis-plus-boot-starter3.5.1org.projectlomboklombok1.18.20mysqlmysql-connector-java8.0.32

1.1.2、在application.yml中配置数据源

server:port: 8070
spring:datasource:type: com.zaxxer.hikari.HikariDataSourcedriver-class-name: com.mysql.cj.jdbc.Driverurl: jdbc:mysql://127.0.01:3306/test_plus?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=false&serverTimezone=GMT%2B8&allowPublicKeyRetrieval=trueusername: rootpassword: Aa123123.
mybatis-plus:type-aliases-package: demo.entityconfiguration:log-impl: org.apache.ibatis.logging.stdout.StdOutImplglobal-config:db-config:table-prefix: t_id-type: automapper-locations: classpath:mappers/*.xml

1.1.3、在启动类中配置分页插件

package demo;import com.baomidou.mybatisplus.annotation.DbType;
import com.baomidou.mybatisplus.extension.plugins.MybatisPlusInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.PaginationInnerInterceptor;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;@SpringBootApplication
@Configuration
@MapperScan("demo.mapper")
public class Demo {/** 配置分页插件*/@Beanpublic MybatisPlusInterceptor mybatisPlusInterceptor() {MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL));return interceptor;}public static void main(String[] args) {SpringApplication.run(Demo.class);}
}

1.2、后台开发

1.2.1、SQL脚本

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;-- ----------------------------
-- Table structure for t_article
-- ----------------------------
DROP TABLE IF EXISTS `t_article`;
CREATE TABLE `t_article` (`id` bigint(20) NOT NULL AUTO_INCREMENT,`title` varchar(50) DEFAULT NULL,`logo` varchar(255) DEFAULT NULL,`descn` varchar(160) DEFAULT NULL,`create_time` datetime DEFAULT NULL,`cid` bigint(20) DEFAULT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1630090627736408069 DEFAULT CHARSET=utf8;-- ----------------------------
-- Records of t_article
-- ----------------------------
BEGIN;
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1, '扬子xx', NULL, 'eeeeeeee', '2023-01-02 00:00:00', 2);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090618022400001, '扬子晚报1', NULL, 'dddsfjslfjalskd', '2023-01-03 00:00:00', 2);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090625282740226, '扬子晚报2', NULL, 'dddsfjslfjalskd', '2023-01-04 00:00:00', 2);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090625865748482, '扬子晚报3', NULL, 'dddsfjslfjalskd', '2023-01-05 00:00:00', 1);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090626520059905, '扬子晚报4', NULL, 'dddsfjslfjalskd', '2023-01-06 00:00:00', 2);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090627165982721, '扬子晚报5', NULL, 'dddsfjslfjalskd', '2023-01-07 00:00:00', 1);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090627736408066, '扬子晚报6', NULL, 'dddsfjslfjalskd', '2023-01-08 00:00:00', 1);
INSERT INTO `t_article` (`id`, `title`, `logo`, `descn`, `create_time`, `cid`) VALUES (1630090627736408068, 'qqq1w', 'kdsjlsfjieosjfiosjdfo', 'eeeee', '2023-02-03 00:00:00', 2);
COMMIT;-- ----------------------------
-- Table structure for t_channel
-- ----------------------------
DROP TABLE IF EXISTS `t_channel`;
CREATE TABLE `t_channel` (`id` bigint(20) NOT NULL,`channel_name` varchar(50) DEFAULT NULL,`create_time` datetime DEFAULT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;-- ----------------------------
-- Records of t_channel
-- ----------------------------
BEGIN;
INSERT INTO `t_channel` (`id`, `channel_name`, `create_time`) VALUES (1, '头条', '2023-02-27 17:27:14');
INSERT INTO `t_channel` (`id`, `channel_name`, `create_time`) VALUES (2, '头七', '2023-02-27 17:27:14');
COMMIT;SET FOREIGN_KEY_CHECKS = 1;

1.2.2、实体Article

package demo.entity;import lombok.Data;@Data
public class Article {private Long id;private String title;private String logo;private String descn;private String createTime;private Long cid;
}

1.2.3、ArticleMapper.java

package demo.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import demo.entity.Article;
import org.apache.ibatis.annotations.Param;
import org.springframework.stereotype.Repository;@Repository
public interface ArticleMapper extends BaseMapper
{Page
selectByPage(Page
page, @Param("title") String title); }

1.2.4、ArticleMapper.xml





1.2.5、ArticleController

package demo.controller;import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import demo.entity.Article;
import demo.mapper.ArticleMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;@RestController
@CrossOrigin
public class ArticleController {@Autowiredprivate ArticleMapper articleMapper;@GetMapping("/list")public Page
findAll(Long pageIndex, Long pageSize){Page
page = articleMapper.selectPage(new Page(pageIndex, pageSize), null);return page;}@GetMapping("/list_custom")public Page
customFindAll(Long pageIndex, Long pageSize, String title){Page
page = articleMapper.selectByPage(new Page(pageIndex, pageSize), title);return page;} }

二、前端开发

2.1、html代码

	
文章列表
编号标题描述发布时间操作
{{art.id}}{{art.title}}{{art.descn}}{{art.createTime}}

2.2、Js代码

	

三、附录

3.1、完整po.m.xml文件


4.0.0org.springframework.bootspring-boot-starter-parent2.7.9 com.examplepage-helper-demo0.0.1-SNAPSHOTpage-helper-demoDemo project for Spring Boot1.8org.springframework.bootspring-boot-starter-webcom.baomidoumybatis-plus-boot-starter3.5.1org.projectlomboklombok1.18.20mysqlmysql-connector-java8.0.32org.springframework.bootspring-boot-maven-plugin

相关内容

热门资讯

万辰集团股价跌5.18%,安信... 7月2日,万辰集团跌5.18%,截至发稿,报177.18元/股,成交1.97亿元,换手率0.69%,...
万辰集团股价跌5.18%,东证... 7月2日,万辰集团跌5.18%,截至发稿,报177.18元/股,成交1.97亿元,换手率0.69%,...
万辰集团股价跌5.18%,宏利... 7月2日,万辰集团跌5.18%,截至发稿,报177.18元/股,成交1.97亿元,换手率0.70%,...
一品红股价跌5.1%,富国基金... 7月2日,一品红跌5.1%,截至发稿,报54.57元/股,成交5.69亿元,换手率2.41%,总市值...
兰州银行涨2.37%,成交额1... 7月2日,兰州银行盘中上涨2.37%,截至10:45,报2.59元/股,成交1.47亿元,换手率1....
水产养殖板块走强 国联水产涨停   07月02日消息,截止10:45,水产养殖板块走强,国联水产、獐子岛、好当家、百洋股份、东方海洋...
斯瑞新材涨2.05%,成交额1... 7月2日,斯瑞新材盘中上涨2.05%,截至10:45,报13.97元/股,成交1.30亿元,换手率1...
基金2025“中考”成绩单出炉... 2025年上半年A股市场在波动中展现出不少投资机遇,结构性行情中,部分优秀基金经理凭借敏锐的市场嗅觉...
新华财经|从塞上江南到陇原大地... 本文转自【新华社】新华社北京7月2日电(记者吴丛司)从塞上江南到陇原大地,一场以科技创新为核心的新质...
重塑企业安全运营效能,“泰岳泰...   炒股就看金麒麟分析师研报,权威,专业,及时,全面,助您挖掘潜力主题机会! 神州泰岳近期推出“泰...