页面效果:
项目环境:idea 2019.3 mysql jdbc 8.0 maven架构:pom.xml
<?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 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>org.example</groupId>
<artifactId>thymeleaf_many</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<properties>
<project.build.sourceEncoding>utf-8</project.build.sourceEncoding>
<springframework.version>5.2.19.RELEASE</springframework.version>
</properties>
<dependencies>
<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf-spring5</artifactId>
<version>3.0.15.RELEASE</version>
</dependency>
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>5.3.0</version>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.2.8</version>
</dependency>
<!-- spring core container -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>${springframework.version}</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aop</artifactId>
<version>${springframework.version}</version>
</dependency>
<!-- aspectj -->
<!-- <dependency>-->
<!-- <groupId>org.aspectj</groupId>-->
<!-- <artifactId>aspectjrt</artifactId>-->
<!-- <version>1.8.10</version>-->
<!-- </dependency>-->
<!-- <dependency>-->
<!-- <groupId>org.aspectj</groupId>-->
<!-- <artifactId>aspectjweaver</artifactId>-->
<!-- <version>1.8.10</version>-->
<!-- </dependency>-->
<!-- bean-validator -->
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-validator</artifactId>
<version>5.4.1.Final</version>
</dependency>
<!-- mybatis -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.5.9</version>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>2.0.7</version>
</dependency>
<!-- mysql-connector-java -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>8.0.28</version>
</dependency>
<!-- commons-dbcp -->
<!-- <dependency>-->
<!-- <groupId>commons-dbcp</groupId>-->
<!-- <artifactId>commons-dbcp</artifactId>-->
<!-- <version>1.4</version>-->
<!-- </dependency>-->
<!-- spring-jdbc -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>${springframework.version}</version>
</dependency>
<!-- <dependency>-->
<!-- <groupId>net.sf.json-lib</groupId>-->
<!-- <artifactId>json-lib</artifactId>-->
<!-- <version>2.4</version>-->
<!-- <classifier>jdk15</classifier>-->
<!-- </dependency>-->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.4</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.8.0</version>
</dependency>
<dependency>
<groupId>ch.qos.logback</groupId>
<artifactId>logback-classic</artifactId>
<version>1.2.11</version>
</dependency>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.12</version>
<scope>test</scope>
</dependency>
<!-- jackson -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.10</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>2.9.10</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-annotations</artifactId>
<version>2.9.10</version>
</dependency>
<!-- https://mvnrepository.com/artifact/org.webjars/bootstrap -->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>bootstrap</artifactId>
<version>4.4.1-1</version>
</dependency>
<!-- https://mvnrepository.com/artifact/org.webjars/jquery -->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.5.1</version>
</dependency>
<!-- <dependency>-->
<!-- <groupId>commons-beanutils</groupId>-->
<!-- <artifactId>commons-beanutils</artifactId>-->
<!-- <version>1.9.3</version>-->
<!-- </dependency>-->
<!--lombok-->
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.16</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>4.0.1</version>
<scope>provided</scope>
</dependency>
</dependencies>
<build>
<resources>
<resource>
<directory>${project.basedir}/src/main/java</directory>
<includes>
<include>**/*.xml</include>
</includes>
</resource>
<resource>
<directory>${project.basedir}/src/main/resources</directory>
</resource>
</resources>
<plugins>
<plugin>
<artifactId>maven-compiler-plugin</artifactId>
<configuration>
<source>1.8</source>
<target>1.8</target>
<encoding>UTF-8</encoding>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<port>9090</port>
<path>/swn</path>
<uriEncoding>UTF-8</uriEncoding>
<finalName>tonysong</finalName>
<server>tomcat7</server>
</configuration>
</plugin>
</plugins>
</build>
</project>
主要涉及Thymeleaf的if判断、图片显示和三目运算符的使用,页面代码如下:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="webjars/jquery/3.5.1/jquery.min.js"></script>
<link href="webjars/bootstrap/4.4.1-1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<table class="table table-bordered table-hover">
<tr>
<td>编号</td>
<td>账号</td>
<td>密码</td>
<td>姓名</td>
<td>性别</td>
<td>手机</td>
<td>头像</td>
</tr>
<tr th:each="user,index:${pager.list}" th:object="${user}">
<td th:text="*{uid}"></td>
<td th:text="*{username}"></td>
<td th:text="*{password}"></td>
<td th:text="*{realname}"></td>
<td th:text="*{sex==0? '男':'女'}"></td>
<td th:text="*{mobile}"></td>
<td>
<img th:src="@{'/upload/'+*{pic}}" width="50px" height="50px">
</td>
</tr>
<tr>
<td colspan="10" align="center">共
<span th:text="${pager.total }"></span>条记录,
共<span th:text="${pager.pages}"></span>页,
当前第<span th:text="${pager.pageNum}"></span>页。
<a th:href="@{users(offset=1)}">首页</a>
<a th:if="${pager.hasPreviousPage}" th:href="@{users(offset=${pager.pageNum-1})}">上页</a>
<a th:if="${pager.hasNextPage}" th:href="@{users(offset=${pager.pageNum+1})}">下页</a>
<a th:href="@{users(offset=${pager.pages})}">末页</a>
</td>
</tr>
</table>
</div>
</body>
</html>
beans.xml:
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/aop
http://www.springframework.org/schema/aop/spring-aop.xsd
http://www.springframework.org/schema/tx
http://www.springframework.org/schema/tx/spring-tx.xsd">
<context:component-scan base-package="edu.song.ssm"/>
<context:property-placeholder location="classpath:jdbc.properties"/>
<bean class="com.alibaba.druid.pool.DruidDataSource" id="dataSource"
p:username="${jdbc.username}"
p:password="${jdbc.password}"
p:url="${jdbc.url}"
p:driverClassName="${jdbc.driver}"
/>
<bean class="org.mybatis.spring.SqlSessionFactoryBean" id="sqlSessionFactory">
<property name="dataSource" ref="dataSource"/>
<property name="typeAliasesPackage" value="edu.song.ssm.pojo"/>
<property name="plugins">
<array>
<bean class="com.github.pagehelper.PageInterceptor"/>
</array>
</property>
</bean>
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"
p:basePackage="edu.song.ssm.mapper"
/>
<bean class="org.springframework.jdbc.datasource.DataSourceTransactionManager" id="transactionManager"
p:dataSource-ref="dataSource"
/>
<tx:annotation-driven transaction-manager="transactionManager"/>
</beans>
spring-mvc.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/aop
http://www.springframework.org/schema/aop/spring-aop.xsd
http://www.springframework.org/schema/tx
http://www.springframework.org/schema/tx/spring-tx.xsd http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd">
<context:component-scan base-package="com.song.thymeleaf.controller"/>
<mvc:view-controller path="/" view-name="index"/>
<mvc:default-servlet-handler/>
<mvc:annotation-driven/>
<bean class="org.thymeleaf.spring5.view.ThymeleafViewResolver" id="viewResolver">
<property name="order" value="1"/>
<property name="characterEncoding" value="utf-8"/>
<property name="templateEngine">
<bean class="org.thymeleaf.spring5.SpringTemplateEngine">
<property name="templateResolver">
<bean class="org.thymeleaf.spring5.templateresolver.SpringResourceTemplateResolver">
<property name="prefix" value="/WEB-INF/templates/"/>
<property name="suffix" value=".html"/>
<property name="characterEncoding" value="utf-8"/>
<property name="templateMode" value="HTML5"/>
</bean>
</property>
</bean>
</property>
</bean>
</beans>
控制器:
@Controller
public class UserController {
@Resource
private IUserService userService;
@GetMapping("/")
public String index(){
return "redirect:/users";
}
@GetMapping("/users")
public String list(Model model, @RequestParam(name ="offset",defaultValue ="1") Integer offset,
@RequestParam(name ="pagesize",defaultValue ="3")Integer pageSize){
PageHelper.startPage(offset,pageSize);
model.addAttribute("pager", new PageInfo<User>(this.userService.findAll()));
model.addAttribute("mess","这是测试!");
return "users";
}
}
User.java
@Data
public class User implements Serializable {
private Integer uid;
private String username;
private String password;
private Integer sex;
private String realname;
private String mobile;
private String pic;
}
UserMapper.java
public interface UserMapper {
List<User> findAllUsers();
}
UserMapper.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="edu.song.ssm.mapper.UserMapper">
<sql id="select_user">
select * from t_user
</sql>
<select id="findAllUsers" resultType="edu.song.ssm.pojo.User">
<include refid="select_user"/>
</select>
</mapper>