springboot视图渲染技术(超详细)

目录

一、Freemarker入门 

项目创建如下:

yml文件:        

自己编写一个以ftl为后缀的类

 创建index.ftl

IndexController

 访问成功​编辑

 二、Freemarker的基本语法

index.ftl

IndexController.java

User

 head.ftl

三,Freemarker综合案例

实现步骤:

添加pom如下:

 把如下配置加到yml文件中 

实体类Clazz.java:

ClazzBiz 

 ClazzMapper.java:

ClazzMapper.xml:

ClazzController.java:

PagerAspect :

StringUtils :

PageBean

前端页面处理:

clzList.ftl

clzEdit.ftl:

 新增

 修改

​编辑 查询

 删除

接下来设置分页功能:

FreemarkerPageHelper .java:


一、Freemarker入门 

SpringBoot默认是不推荐使用jsp的,本身就是向前端推送数据。

学习网址:

http://freemarker.foofun.cn/

项目创建如下:

六个组件 

 生成后相关配置稍作调整

yml文件:        

mybatis:
    mapper-locations: classpath:mapper/*xml
    type-aliases-package: com.ljj.spboot04.mybatis.entity
server:
    port: 8080
spring:
    application:
        name: spboot04
    datasource:
        driver-class-name: com.mysql.jdbc.Driver
        name: defaultDataSource
        password: 123456
        url: jdbc:mysql://localhost:3306/mybatis_ssm?useUnicode=true&characterEncoding=UTF-8
        username: root
    freemarker:
        cache: false
        charset: utf-8
        expose-request-attributes: true
        expose-session-attributes: true
        suffix: .ftl
        template-loader-path: classpath:/templates/
#    resources:
#        static-locations: classpath:/static/# 应用服务 WEB 访问端口
    mvc:
        static-path-pattern: classpath:/static/

接着,

自己编写一个以ftl为后缀的类

,对应配置中的suffix:.ftl

 创建index.ftl

 编写一个方法用于访问ftl页面

IndexController

package com.ljj.spboot04.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @author ljj
 * @site www.xiaomage.com
 * @company
 * @create  2022-11-06 20:40
 */
@Controller
public class IndexController {

    @RequestMapping("/")
    public String index(){
        System.out.println("come in 。。。 ");
//        suffix: .ftl
//        template-loader-path: classpath:/templates/
//        /templates/index.ftl
        return "index";
    }

}

 访问成功

 二、Freemarker的基本语法

只需四个类

indexController用于传递参数与访问index.ftl

user用于储存对象数组

head.ftl编写一个局部变量和全局变量供index.ftl获取

index.ftl编写语法和效果展示

修改一下配置,访问路径发生改变

index.ftl

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<h2>1.取值</h2>
<h3>1.1. 提供默认值</h3>
<#--报错  当接收的参数值不为空会报错,这个问题是需要避免的-->
<#--${uname}    -->
<#--不报错,但是页面无内容-->
<#--${uname !}-->
<#--给值设置一个默认值-->
${uname! '无名'}

<h3>1.2. 对null值先进行判断</h3>
<p>1)exists用在逻辑判断;</p>
<#if uname?exists>
    ${uname}
</#if>
<br>
<p>2)??是判断对象是否为空</p>
<#if uname??>
    ${uname}
</#if>
<br>
<p>3)if_exists用来打印东西</p>
${uname?if_exists}
<br>

<h3>2.条件</h3>
<#if sex=='nv'>
    女
<#elseif sex='nan'>
    男
<#else>
    未知
</#if>
<br>


<h3>3.循环</h3>
<p>1)取出数组中的元素</p>
<#list arr as a>
    ${a}==
</#list>
<br>
<p>2)取出集合中的对象(注:访问的类要被public所修饰)</p>
<#list users as item>
    ${item.id} : ${item.name}    <br>
</#list>

<h3>4 include</h3>
<#include '/head.ftl'>
<h3>5 局部变量(assign)/全局变量(global)</h3>
${ctx}:${ctx2}
</body>
</html>

IndexController.java

package com.ljj.spboot04.controller;

import com.ljj.spboot04.entity.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.Arrays;

/**
 * @author ljj
 * @site www.xiaomage.com
 * @company
 * @create  2022-11-06 20:40
 */
@Controller
public class IndexController {



    @RequestMapping("/")
    public String index(Model model){
        model.addAttribute("sex","nan");
        model.addAttribute("users", Arrays.asList(new User(1,"zs")
                ,new User(2,"ls"),new User(3,"ww")));
        model.addAttribute("arr",new Integer[]{3,4,5,6,7,8,9});
        System.out.println("Come in ....");
//        suffix: .ftl
//        template-loader-path: classpath:/templates/
//        /templates/index.ftl
        return "index";
    }
}

User

package com.ljj.spboot04.entity;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@NoArgsConstructor
@AllArgsConstructor
public class User{
    private int id;
    private String name;
}

 head.ftl

通过这两个标签获取路径

<#assign ctx>
    ${springMacroRequestContext.contextPath}
</#assign>

<#global ctx2>
    ${springMacroRequestContext.contextPath}
</#global>

运行项目后返回index.ftl获取到的数据

三,Freemarker综合案例

利用Freemarker完成基本的增删改查,参照之前ssm项目进行改造

实现步骤:

1、entity、Mapper.java、Mapper.xml、biz、Controller

2、整合aop PageHelper插件
3、jsp——>freemarker
4、jsp中是有分页标签<z:page pagebean="${pagebean}"/> ——> freemarker中的分页条展示问题,以及分页功能

 

 

SpringBoot aop整合分页,

添加pom如下:

<dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-aspects</artifactId>
      <version>5.0.2.RELEASE</version>
    </dependency>
    
    <dependency>
       <groupId>com.github.pagehelper</groupId>
       <artifactId>pagehelper-spring-boot-starter</artifactId>
       <version>1.2.3</version>
     </dependency> 

完整版依赖:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>com.ljj</groupId>
    <artifactId>spboot04</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>spboot04</name>
    <description>Demo project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
        <spring-boot.version>2.3.7.RELEASE</spring-boot.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-jdbc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>2.1.4</version>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.44</version>
        </dependency>
<!--支持aop-->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-aspects</artifactId>
            <version>5.0.2.RELEASE</version>
        </dependency>
<!--支持分页 pageHelper-->
        <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper-spring-boot-starter</artifactId>
            <version>1.2.3</version>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
            <exclusions>
                <exclusion>
                    <groupId>org.junit.vintage</groupId>
                    <artifactId>junit-vintage-engine</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
    </dependencies>

    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-dependencies</artifactId>
                <version>${spring-boot.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <build>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.8.1</version>
                <configuration>
                    <source>1.8</source>
                    <target>1.8</target>
                    <encoding>UTF-8</encoding>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <version>2.3.7.RELEASE</version>
                <configuration>
                    <mainClass>com.ljj.spboot04.Spboot04Application</mainClass>
                </configuration>
                <executions>
                    <execution>
                        <id>repackage</id>
                        <goals>
                            <goal>repackage</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

</project>

 把如下配置加到yml文件中 

 pagehelper:
  reasonable: true
  supportMethodsArguments: true
  page-size-zero: true
  helper-dialect: mysql

mybatis:
    mapper-locations: classpath:mapper/*xml
    type-aliases-package: com.ljj.spboot04.model
server:
    port: 8080
    servlet:
        context-path: /spboot04
spring:
    application:
        name: spboot04
    datasource:
        driver-class-name: com.mysql.jdbc.Driver
        name: defaultDataSource
        password: 123456
        url: jdbc:mysql://localhost:3306/mybatis_ssm?useUnicode=true&characterEncoding=UTF-8
        username: root
    freemarker:
        cache: false
        charset: utf-8
        expose-request-attributes: true
        expose-session-attributes: true
        suffix: .ftl
        template-loader-path: classpath:/templates/
#    resources:
#        static-locations: classpath:/static/# 应用服务 WEB 访问端口
    mvc:
        static-path-pattern: classpath:/static/
    x pagehelper:
        reasonable: true
        supportMethodsArguments: true
        page-size-zero: true
        helper-dialect: mysql

实体类Clazz.java:

package com.ljj.spboot04.model;


/**
 * NotNull:针对的是基本数据类型
 *
 * @NotEmpty 作用于集合
 * @NotBlank 作用于字符串
 */
public class Clazz {
    protected Integer cid;

    protected String cname;

    protected String cteacher;

    protected String pic;

    public Clazz(Integer cid, String cname, String cteacher, String pic) {
        this.cid = cid;
        this.cname = cname;
        this.cteacher = cteacher;
        this.pic = pic;
    }

    public Clazz() {
        super();
    }

    public Integer getCid() {
        return cid;
    }

    public void setCid(Integer cid) {
        this.cid = cid;
    }

    public String getCname() {
        return cname;
    }

    public void setCname(String cname) {
        this.cname = cname;
    }

    public String getCteacher() {
        return cteacher;
    }

    public void setCteacher(String cteacher) {
        this.cteacher = cteacher;
    }

    public String getPic() {
        return pic;
    }

    public void setPic(String pic) {
        this.pic = pic;
    }
}

ClazzBiz 

package com.ljj.spboot04.biz;

import com.ljj.spboot04.model.Clazz;
import com.ljj.spboot04.util.PageBean;
import org.springframework.cache.annotation.CacheEvict;
import org.springframework.cache.annotation.CachePut;
import org.springframework.cache.annotation.Cacheable;

import java.util.List;
import java.util.Map;

public interface ClazzBiz {
    int deleteByPrimaryKey(Integer cid);

    int insert(Clazz record);

    int insertSelective(Clazz record);

    Clazz selectByPrimaryKey(Integer cid);

    int updateByPrimaryKeySelective(Clazz record);

    int updateByPrimaryKey(Clazz record);

    List<Clazz> listPager(Clazz clazz, PageBean pageBean);

    List<Map> listMapPager(Clazz clazz, PageBean pageBean);
}

 ClazzMapper.java:

package com.ljj.spboot04.mapper;

import com.ljj.spboot04.model.Clazz;
import org.springframework.stereotype.Repository;

import java.util.List;
import java.util.Map;

@Repository
public interface ClazzMapper {
    int deleteByPrimaryKey(Integer cid);

    int insert(Clazz record);

    int insertSelective(Clazz record);

    Clazz selectByPrimaryKey(Integer cid);

    List<Clazz> listPager(Clazz clazz);

    List<Map> listMapPager(Clazz clazz);

    int updateByPrimaryKeySelective(Clazz record);

    int updateByPrimaryKey(Clazz record);
}

ClazzMapper.xml:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
<mapper namespace="com.ljj.spboot04.mapper.ClazzMapper">
    <resultMap id="BaseResultMap" type="com.ljj.spboot04.model.Clazz">
        <constructor>
            <idArg column="cid" jdbcType="INTEGER" javaType="java.lang.Integer"/>
            <arg column="cname" jdbcType="VARCHAR" javaType="java.lang.String"/>
            <arg column="cteacher" jdbcType="VARCHAR" javaType="java.lang.String"/>
            <arg column="pic" jdbcType="VARCHAR" javaType="java.lang.String"/>
        </constructor>
    </resultMap>
    <sql id="Base_Column_List">
    cid, cname, cteacher, pic
  </sql>
    <select id="selectByPrimaryKey" resultMap="BaseResultMap" parameterType="java.lang.Integer">
        select
        <include refid="Base_Column_List"/>
        from t_struts_class
        where cid = #{cid,jdbcType=INTEGER}
    </select>

    <select id="listMapPager" resultType="java.util.Map" parameterType="com.ljj.spboot04.model.Clazz">
        select
        <include refid="Base_Column_List"/>
        from t_struts_class
        <where>
            <if test="cname != null and cname != ''">
                and cname like CONCAT('%',#{cname},'%')
            </if>
            <if test="cid != null and cid != ''">
                and cid = #{cid}
            </if>
        </where>
    </select>

    <select id="listPager" resultType="com.ljj.spboot04.model.Clazz" parameterType="com.ljj.spboot04.model.Clazz">
        select
        <include refid="Base_Column_List"/>
        from t_struts_class
        <where>
            <if test="cname != null and cname != ''">
                and cname like CONCAT('%',#{cname},'%')
            </if>
            <if test="cid != null and cid != ''">
                and cid = #{cid}
            </if>
        </where>
    </select>

    <delete id="deleteByPrimaryKey" parameterType="java.lang.Integer">
    delete from t_struts_class
    where cid = #{cid,jdbcType=INTEGER}
  </delete>
    <insert id="insert" parameterType="com.ljj.spboot04.model.Clazz">
    insert into t_struts_class (cid, cname, cteacher, 
      pic)
    values (#{cid,jdbcType=INTEGER}, #{cname,jdbcType=VARCHAR}, #{cteacher,jdbcType=VARCHAR}, 
      #{pic,jdbcType=VARCHAR})
  </insert>
    <insert id="insertSelective" parameterType="com.ljj.spboot04.model.Clazz">
        insert into t_struts_class
        <trim prefix="(" suffix=")" suffixOverrides=",">
            <if test="cid != null">
                cid,
            </if>
            <if test="cname != null">
                cname,
            </if>
            <if test="cteacher != null">
                cteacher,
            </if>
            <if test="pic != null">
                pic,
            </if>
        </trim>
        <trim prefix="values (" suffix=")" suffixOverrides=",">
            <if test="cid != null">
                #{cid,jdbcType=INTEGER},
            </if>
            <if test="cname != null">
                #{cname,jdbcType=VARCHAR},
            </if>
            <if test="cteacher != null">
                #{cteacher,jdbcType=VARCHAR},
            </if>
            <if test="pic != null">
                #{pic,jdbcType=VARCHAR},
            </if>
        </trim>
    </insert>
    <update id="updateByPrimaryKeySelective" parameterType="com.ljj.spboot04.model.Clazz">
        update t_struts_class
        <set>
            <if test="cname != null">
                cname = #{cname,jdbcType=VARCHAR},
            </if>
            <if test="cteacher != null">
                cteacher = #{cteacher,jdbcType=VARCHAR},
            </if>
            <if test="pic != null">
                pic = #{pic,jdbcType=VARCHAR},
            </if>
        </set>
        where cid = #{cid,jdbcType=INTEGER}
    </update>
    <update id="updateByPrimaryKey" parameterType="com.ljj.spboot04.model.Clazz">
    update t_struts_class
    set cname = #{cname,jdbcType=VARCHAR},
      cteacher = #{cteacher,jdbcType=VARCHAR},
      pic = #{pic,jdbcType=VARCHAR}
    where cid = #{cid,jdbcType=INTEGER}
  </update>
</mapper>

ClazzController.java:

package com.ljj.spboot04.controller;

import com.ljj.spboot04.biz.ClazzBiz;
import com.ljj.spboot04.model.Clazz;
import com.ljj.spboot04.util.FreemarkerPageHelper;
import com.ljj.spboot04.util.PageBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import javax.servlet.http.HttpServletRequest;
import java.util.List;

/**
 * @author小李飞刀
 * @site www.javaxl.com
 * @company xxx公司
 * @create  2022-08-17 15:23
 */
@Controller
@RequestMapping("/clz")
public class ClazzController {
    @Autowired
    private ClazzBiz clazzBiz;

    //    list->clzList
//    toList->重定向list->"redirect:/clz/list"
//    toEdit->跳转到编辑界面->clzEdit
//    Clazz : 以前是通过模型驱动接口封装,现在是直接在方法中接受参数即可
    @RequestMapping("/list")
    public String list(Clazz clazz, HttpServletRequest request) {
        System.out.println("我添加了 新的代码,终于不重启了....");
        PageBean pageBean = new PageBean();
        pageBean.setRequest(request);
        List<Clazz> lst = this.clazzBiz.listPager(clazz, pageBean);
        request.setAttribute("lst", lst);
        request.setAttribute("pageBean", pageBean);
       
        return "clz/clzList";
    }

    @RequestMapping("/toEdit")
    public String toEdit(Clazz clazz, HttpServletRequest request) {
        Integer cid = clazz.getCid();
//        传递的id代表了修改,没传代表新增
        if (cid != null) {
            List<Clazz> lst = this.clazzBiz.listPager(clazz, null);
            request.setAttribute("b", lst.get(0));
        }
        return "clz/clzEdit";
    }

    @RequestMapping("/add")
    public String add(Clazz clazz) {
        this.clazzBiz.insertSelective(clazz);
        return "redirect:/clz/list";
    }

    @RequestMapping("/edit")
    public String edit(Clazz clazz) {
        this.clazzBiz.updateByPrimaryKeySelective(clazz);
        return "redirect:/clz/list";
    }

    @RequestMapping("/del")
    public String del(Clazz clazz) {
        this.clazzBiz.deleteByPrimaryKey(clazz.getCid());
        return "redirect:/clz/list";
    }

}

PagerAspect :

package com.ljj.spboot04.aspect;

import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.ljj.spboot04.util.PageBean;
import org.aspectj.lang.ProceedingJoinPoint;
import org.aspectj.lang.annotation.Around;
import org.aspectj.lang.annotation.Aspect;
import org.springframework.stereotype.Component;

import java.util.List;

@Component
@Aspect
public class PagerAspect {

    /**
     * *:返回值类型
     * *..:无限包
     * *Service:以Service结尾接口名
     * *Pager:以Pager方法
     * 只要同时匹配上诉四个条件,就会被列为目标对象
     * 上述配置要生效,代理注解<aop:aspectj-autoproxy/>不能少
     *
     * @param args
     * @return
     * @throws Throwable
     */
    @Around("execution(* *..*Biz.*Pager(..))")
    public Object invoke(ProceedingJoinPoint args) throws Throwable {
        Object[] params = args.getArgs();
        PageBean pageBean = null;
        for (Object param : params) {
            if (param instanceof PageBean) {
                pageBean = (PageBean) param;
                break;
            }
        }

        if (pageBean != null && pageBean.isPagination())
            PageHelper.startPage(pageBean.getPage(), pageBean.getRows());

//        执行目标方法
        Object list = args.proceed(params);

        if (null != pageBean && pageBean.isPagination()) {
            PageInfo pageInfo = new PageInfo((List) list);
            pageBean.setTotal(pageInfo.getTotal() + "");
        }
        return list;
    }


}

StringUtils :

package com.ljj.spboot04.util;

public class StringUtils {
    // 私有的构造方法,保护此类不能在外部实例化
    private StringUtils() {
    }

    /**
     * 如果字符串等于null或去空格后等于"",则返回true,否则返回false
     *
     * @param s
     * @return
     */
    public static boolean isBlank(String s) {
        boolean b = false;
        if (null == s || s.trim().equals("")) {
            b = true;
        }
        return b;
    }

    /**
     * 如果字符串不等于null或去空格后不等于"",则返回true,否则返回false
     *
     * @param s
     * @return
     */
    public static boolean isNotBlank(String s) {
        return !isBlank(s);
    }

}

PageBean

package com.ljj.spboot04.util;

import java.util.HashMap;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

/**
 * 分页工具类
 */
public class PageBean {

    private int page = 1;// 页码

    private int rows = 10;// 页大小

    private int total = 0;// 总记录数

    private boolean pagination = true;// 是否分页

    private String url; //保存上一次请求的URL

    private Map<String, String[]> paramMap = new HashMap<>();// 保存上一次请求的参数

    /**
     * 初始化pagebean的,保存上一次请求的重要参数
     *
     * @param req
     */
    public void setRequest(HttpServletRequest req) {
//		1.1	需要保存上一次请求的URL
        this.setUrl(req.getRequestURL().toString());
//		1.2	需要保存上一次请求的参数	bname、price
        this.setParamMap(req.getParameterMap());
//		1.3	需要保存上一次请求的分页设置	pagination
        this.setPagination(req.getParameter("pagination"));
//		1.4	需要保存上一次请求的展示条目数
        this.setRows(req.getParameter("rows"));
//		1.5  初始化请求的页码	page
        this.setPage(req.getParameter("page"));
    }

    public void setPage(String page) {
        if (StringUtils.isNotBlank(page))
            this.setPage(Integer.valueOf(page));
    }

    public void setRows(String rows) {
        if (StringUtils.isNotBlank(rows))
            this.setRows(Integer.valueOf(rows));
    }

    public void setPagination(String pagination) {
//		只有在前台jsp填写了pagination=false,才代表不分页
        if (StringUtils.isNotBlank(pagination))
            this.setPagination(!"false".equals(pagination));
    }


    public String getUrl() {
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }

    public Map<String, String[]> getParamMap() {
        return paramMap;
    }

    public void setParamMap(Map<String, String[]> paramMap) {
        this.paramMap = paramMap;
    }


    public PageBean() {
        super();
    }

    public int getPage() {
        return page;
    }

    public void setPage(int page) {
        this.page = page;
    }

    public int getRows() {
        return rows;
    }

    public void setRows(int rows) {
        this.rows = rows;
    }

    public int getTotal() {
        return total;
    }

    public void setTotal(int total) {
        this.total = total;
    }

    public void setTotal(String total) {
        this.total = Integer.parseInt(total);
    }

    public boolean isPagination() {
        return pagination;
    }

    public void setPagination(boolean pagination) {
        this.pagination = pagination;
    }

    /**
     * 获得起始记录的下标
     *
     * @return
     */
    public int getStartIndex() {
        return (this.page - 1) * this.rows;
    }

    /**
     * 最大页
     *
     * @return
     */
    public int maxPage() {
//		total % rows == 0 ? total / rows : total / rows +1
        return this.total % this.rows == 0 ? this.total / this.rows : this.total / this.rows + 1;
    }

    /**
     * 下一页
     *
     * @return
     */
    public int nextPage() {
//		如果当前页小于最大页,那就下一页为当前页+1;如果不小于,说明当前页就是最大页,那就无需+1
        return this.page < this.maxPage() ? this.page + 1 : this.page;
    }

    /**
     * 上一页
     *
     * @return
     */
    public int previousPage() {
        return this.page > 1 ? this.page - 1 : this.page;
    }

    @Override
    public String toString() {
        return "PageBean [page=" + page + ", rows=" + rows + ", total=" + total + ", pagination=" + pagination + "]";
    }

}

前端页面处理:

clzList.ftl

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link
            href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.css"
            rel="stylesheet">
    <script
            src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.js"></script>
    <title>班级列表</title>
    <style type="text/css">
        .page-item input {
            padding: 0;
            width: 40px;
            height: 100%;
            text-align: center;
            margin: 0 6px;
        }

        .page-item input, .page-item b {
            line-height: 38px;
            float: left;
            font-weight: 400;
        }

        .page-item.go-input {
            margin: 0 10px;
        }
    </style>
</head>
<body>
<#include '/head.ftl'/>
<#--查询的条件框-->
<form class="form-inline"
      action="${ctx }/clz/list" method="post">
    <div class="form-group mb-2">
        <input type="text" class="form-control-plaintext" name="cname"
               placeholder="请输入班级名称">
    </div>
    <button type="submit" class="btn btn-primary mb-2">查询</button>
    <a class="btn btn-primary mb-2" href="${ctx }/clz/toEdit">新增</a>
</form>

<#--数据展示条-->
<table class="table table-striped ">
    <thead>
    <tr>
        <th scope="col">ID</th>
        <th scope="col">班级名称</th>
        <th scope="col">指导老师</th>
        <th scope="col">操作</th>
    </tr>
    </thead>
    <tbody>

    <#list lst as b>
        <tr>
            <td>${b.cid !}</td>
            <td>${b.cname !}</td>
            <td>${b.cteacher !}</td>
            <td>
                <a href="${ctx }/clz/toEdit?cid=${b.cid}">修改</a>
                <a href="${ctx }/clz/del?cid=${b.cid}">删除</a>
            </td>
        </tr>
    </#list>
    </tbody>
</table>

</body>
</html>

clzEdit.ftl:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>编辑界面</title>
</head>
<body>
<#include '/head.ftl' />
<#if b??>
<#--修改-->
    <form action="${ctx }/clz/edit" method="post">
        cid:<input type="text" name="cid" value="${b.cid !}"><br>
        cname:<input type="text" name="cname" value="${b.cname !}"><br>
        cteacher:<input type="text" name="cteacher" value="${b.cteacher !}"></span><br>
        <input type="submit">
    </form>
<#else >
<#--新增-->
    <form action="${ctx }/clz/add" method="post">
        cid:<input type="text" name="cid" value=""><br>
        cname:<input type="text" name="cname" value=""><br>
        cteacher:<input type="text" name="cteacher" value=""><br>
        <input type="submit">
    </form>
</#if>

</body>
</html>

此时页面效果如下:

 新增

 修改

 查询

 删除

接下来设置分页功能:

用于Freemarker引擎生成分页条的工具类

FreemarkerPageHelper .java:

package com.ljj.spboot04.util;

import java.util.Map;
import java.util.Set;


public class FreemarkerPageHelper {
    public static String toHTML(PageBean pageBean) {
        StringBuffer sb = new StringBuffer();
//		隐藏的form表单---这个就是上一次请求下次重新发的奥义所在
//		上一次请求的URL
        sb.append("<form action='"+pageBean.getUrl()+"' id='pageBeanForm' method='post'>");
        sb.append("	<input type='hidden' name='page'>");
//		上一次请求的参数
        Map<String, String[]> paramMap = pageBean.getParamMap();
        if(paramMap != null && paramMap.size() > 0) {
            Set<Map.Entry<String, String[]>> entrySet = paramMap.entrySet();
            for (Map.Entry<String, String[]> entry : entrySet) {
//				参数名
                String key = entry.getKey();
//				参数值
                for (String value : entry.getValue()) {
//					上一次请求的参数,再一次组装成了新的Form表单
//					注意:page参数每次都会提交,我们需要避免
                    if(!"page".equals(key)) {
                        sb.append("	<input type='hidden' name='"+key+"' value='"+value+"' >");
                    }
                }
            }
        }
        sb.append("</form>");

//		分页条
        sb.append("<ul class='pagination justify-content-center'>");
        sb.append("	<li class='page-item "+(pageBean.getPage() == 1 ? "disabled" : "")+"'><a class='page-link'");
        sb.append("	href='javascript:gotoPage(1)'>首页</a></li>");
        sb.append("	<li class='page-item "+(pageBean.getPage() == 1 ? "disabled" : "")+"'><a class='page-link'");
        sb.append("	href='javascript:gotoPage("+pageBean.previousPage()+")'>&lt;</a></li>");// less than 小于号
//		sb.append("	<li class='page-item'><a class='page-link' href='#'>1</a></li>");
//		sb.append("	<li class='page-item'><a class='page-link' href='#'>2</a></li>");
        sb.append("	<li class='page-item active'><a class='page-link' href='#'>"+pageBean.getPage()+"</a></li>");
        sb.append("	<li class='page-item "+(pageBean.getPage() == pageBean.maxPage() ? "disabled" : "")+"'><a class='page-link' href='javascript:gotoPage("+pageBean.nextPage()+")'>&gt;</a></li>");
        sb.append("	<li class='page-item "+(pageBean.getPage() == pageBean.maxPage() ? "disabled" : "")+"'><a class='page-link' href='javascript:gotoPage("+pageBean.maxPage()+")'>尾页</a></li>");
        sb.append("	<li class='page-item go-input'><b>到第</b><input class='page-link'");
        sb.append("	type='text' id='skipPage' name='' /><b>页</b></li>");
        sb.append("	<li class='page-item go'><a class='page-link'");
        sb.append("	href='javascript:skipPage()'>确定</a></li>");
        sb.append("	<li class='page-item'><b>共"+pageBean.getTotal()+"条</b></li>");
        sb.append("</ul>");

//		分页执行的JS代码
        sb.append("<script type='text/javascript'>");
        sb.append("	function gotoPage(page) {");
        sb.append("		document.getElementById('pageBeanForm').page.value = page;");
        sb.append("		document.getElementById('pageBeanForm').submit();");
        sb.append("	}");
        sb.append("	function skipPage() {");
        sb.append("		var page = document.getElementById('skipPage').value;");
        sb.append("		if (!page || isNaN(page) || parseInt(page) < 1 || parseInt(page) > "+pageBean.maxPage()+") {");
        sb.append("			alert('请输入1~"+pageBean.maxPage()+"的数字');");
        sb.append("			return;");
        sb.append("		}");
        sb.append("		gotoPage(page);");
        sb.append("	}");
        sb.append("</script>");

        return sb.toString();
    }

}

 去controller添加: 

还有clzList添加:

分页效果:

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Springboot 中,一般使用 Thymeleaf 模板引擎来渲染页面。 1. 添加 Thymeleaf 依赖 在 pom.xml 文件中添加 Thymeleaf 和 Springboot Thymeleaf 的依赖: ```xml <dependencies> ... <!--Thymeleaf--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> ... </dependencies> ``` 2. 创建 HTML 页面 在 src/main/resources/templates 目录下创建 HTML 页面,例如 index.html: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Springboot Thymeleaf</title> </head> <body> <h1>Hello, Thymeleaf!</h1> <p th:text="${message}"></p> </body> </html> ``` 在 HTML 页面中,使用 Thymeleaf 的语法来设置变量值,例如上面的 ${message} 变量就需要在后面的代码中指定它的值。 3. 创建 Controller 在 Springboot 的 Controller 类中添加处理请求的方法,例如 HomeController: ```java @Controller public class HomeController { @GetMapping("/") public String index(Model model) { model.addAttribute("message", "Welcome to Springboot Thymeleaf!"); return "index"; } } ``` 该方法会接收 GET 方法的请求并返回 index.html 页面。 在方法中,使用 model 对象来传递变量值,例如上面的 "message" 变量就是通过 model.addAttribute("message", "Welcome to Springboot Thymeleaf!") 语句传递的。 其中,返回值 "index" 是 HTML 页面的文件名(不需要后缀名),Springboot 会自动在 templates 目录下查找该文件并渲染它。 4. 运行应用程序 运行 Springboot 应用程序,访问 http://localhost:8080/ ,可以看到渲染好的 HTML 页面。 总结一下,渲染 Springboot 页面的主要步骤如下: 1. 添加 Thymleaf 依赖; 2. 创建 HTML 页面,使用 Thymeleaf 语法设置变量值; 3. 创建 Controller 类,在方法中使用 model 对象传递变量值并返回 HTML 页面的文件名; 4. 运行应用程序,访问相应的 URL,查看渲染结果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值