0
点赞
收藏
分享

微信扫一扫

SpringBoot+thymeleaf[小案例]

钟罗敏 2022-02-26 阅读 42

搭建项目

 pom.xml

<parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.1.1.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <!--热部署-->
        <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-devtools</artifactId>
            <!--<version>2.1.6.RELEASE</version>-->
                <optional>true</optional>
        </dependency>

        <!--  springboot的web启动器-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-configuration-processor</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>tk.mybatis</groupId>
            <artifactId>mapper-spring-boot-starter</artifactId>
            <version>2.0.2</version>
        </dependency>

        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>2.0.1</version>
        </dependency>
        <!-- mysql 数据库驱动 -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.38</version>
        </dependency>


        <!-- druid 数据库连接池 -->
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid</artifactId>
            <version>1.0.9</version>
        </dependency>
        <!-- 添加 junit 环境的 jar 包 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
        </dependency>
        <dependency>
            <groupId>org.apache.commons</groupId>
            <artifactId>commons-lang3</artifactId>
            <version>3.0</version>
        </dependency
  >
    </dependencies>

 application.yml 

server:
  port: 8003

spring:
  datasource:
    driver-class-name: com.mysql.jdbc.Driver
    url: jdbc:mysql://localhost:3306/t2
    username: root
    password: root
    type: com.alibaba.druid.pool.DruidDataSource

  thymeleaf:
    prefix: classpath:/templates/ # 访问template下的html文件需要配置模板,映射,路径指向
    suffix: .html
    cache: false # 开发时关闭缓存,不然没法看到实时页面

mybatis:
  type-aliases-package: com.jiyun.pojo
  mapper-locations: classpath:mappert/*.xml

数据库:

CREATE   TABLE   yong (
id   int PRIMARY  key   auto_increment,
name  VARCHAR (20),
sex  int,
pwd  VARCHAR(20),
birth     VARCHAR(20)



)

启动类:

@SpringBootApplication
@MapperScan("com.jiyun.mapper")
public class Application    {

    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);

    }

//    protected   void  addRes(ResourceHandlerRegistry registry)  {
//
//    }


controller:

package com.jiyun.controller;

import com.jiyun.pojo.Chong;
import com.jiyun.pojo.Yong;
import com.jiyun.servicew.ServiceChong;
import com.jiyun.servicew.ServiceChongimpl;
import org.hibernate.validator.constraints.pl.REGON;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;

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

@Controller
@RequestMapping("user")
public class ChongController {

    @Autowired
    ServiceChong serviceChong;
//    添加
    @RequestMapping("add")
    public   String   add( Yong  yong){
        serviceChong.add(yong);

        return "redirect:/user/listUser";

    }
//修改
    @RequestMapping("update")
    public   String   add1(  Yong  yong){
        serviceChong.update(yong);

        return "redirect:/user/listUser";

    }
    @RequestMapping("add2")
    public   String   add( ){
      return   "add";

    }

    @RequestMapping("del")
//    转换成json
//    @ResponseBody
    public   String   add( String id  ){
        serviceChong.del(id);
        return  "redirect:/user/listUser";

    }
//修改的回显
    @RequestMapping("getid")
//    转换成json
//    @ResponseBody
    public   String   getid( Integer id,Model  model ){
     Yong  yong=   serviceChong.getid(id);
        model.addAttribute("yong",yong);
        return  "hui";

    }
//展示所有
    @RequestMapping("/listUser")
    public String listUser(Model model) {
        List<Yong> list = this.serviceChong.listUser();
        model.addAttribute("list", list);
        return "show";
    }

//登录
    @RequestMapping("/login")
    public String login(Model model, Yong yong, HttpSession session) {
        Yong user = serviceChong.login(yong);
        if(user!=null){
            session.setAttribute("user", user);
            return "redirect:/user/listUser";
        }
        return "add";
    }
 }

ServiceImpl

Service
public class ServiceChongimpl  implements ServiceChong{
@Autowired
  private YongMapper chomgMapper;

    public void add(Yong yong) {
        chomgMapper.add(yong);

    }

    @Override
    public List<Yong> listUser() {
        return chomgMapper.listUser();
    }

    @Override
    public Yong login(Yong yong) {
        return chomgMapper.login(yong);
    }

    @Override
    public void del(String id) {
        chomgMapper.del(id);
    }

    @Override
    public Yong getid(Integer id) {
        return chomgMapper.getid(id);
    }

    @Override
    public void update(Yong yong) {
        chomgMapper.update(yong);
    }
}

 

mapper以及xml

 


public interface YongMapper {
    void add(Yong yong);


    List<Yong> listUser();

    Yong login(Yong yong);
@Update("delete   from  yong   where  id=#{id}")
    void del(@Param("id") String id);
@Select("select  *  from  yong   where id=#{id} ")
    Yong getid(@Param("id") Integer id);
//@Update("update  yong  set   name=#{name},sex=#{sex},pwd=#{pwd},birth=#{birth} where id=#{id}")
    void update( Yong yong);

}


---------------------------------------------------------------------
<?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.jiyun.mapper.YongMapper">
    <insert id="add" parameterType="com.jiyun.pojo.Yong">
		insert into yong(name,sex,pwd,birth) values(#{name},#{sex},#{pwd},#{birth})
	</insert>
	<update id="update" parameterType="com.jiyun.pojo.Yong" >
update  yong  set   name=#{name},sex=#{sex},pwd=#{pwd},birth=#{birth} where id=#{id}
	</update>

	<select id="listUser" resultType="com.jiyun.pojo.Yong">
		select   * from  yong
	</select>
	<select id="login" resultType="com.jiyun.pojo.Yong">
	select * from yong where name=#{name} and pwd=#{pwd}


	</select>
</mapper>

前端

展示所有:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <style type="text/css">
        table {border-collapse: collapse; font-size: 14px; width: 80%; margin: auto}
        table, th, td {border: 1px solid darkslategray;padding: 10px}
    </style>
</head>
<body  th:style="'backgroud-image:url(img/fd.png)'">
<div style="text-align: center">
    <span style="color: darkslategray; font-size: 30px">欢迎光临!</span>
    <hr/>

<!--&lt;!&ndash;&ndash;&gt;超链接-->

    <a th:href="@{/user/add2}">添加</a>
<!--按钮-->
   <form th:action="@{/user/add2}"  method="post">
       <!--<input type="submit"  value="添加">-->
   </form>
    <table class="list">
        <tr>
            <th>id</th>
            <th>姓名</th>
            <th>密码</th>
            <th>性别</th>
            <th>生日</th>
        </tr>
        <tr th:each="user : ${list}">
            <td th:text="${user.id}"></td>
            <td th:text="${user.name}"></td>
            <td th:text="${user.pwd}"></td>
            <td th:text="${user.sex==1}?'男':'女'"></td>
            <td th:text="${user.birth}"></td>

            <td>
                <a th:href="@{/user/del/(id=${user.id})}">删除</a>
                <a th:href="@{/user/getid/(id=${user.id})}">修改</a>

            </td>
        </tr>
    </table>
</div>
</body>

</html>

 效果

添加:

  

修改:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>修改用户</title>

</head>
<body  bgcolor="aqua">
<form  th:object="${yong}" th:action="@{/user/update}" method="post">
   <input type="hidden"  name="id"  th:value="*{id}"> <br>
   姓名 <input type="text"  name="name"  th:value="${yong.name}"> <br>
    密码<input type="text"  name="pwd"  th:value="${yong.pwd}" > <br>
    性别<input type="radio"   name="sex"    value="0"  th:attr="checked=${yong.sex==0?true:false}"   > 女<br>
    性别<input type="radio"  name="sex" value="1"    th:attr="checked=${yong.sex==1?true:false}"  > 男<br>
    生日<input type="text"  name="birth" th:value="*{birth}" > <br>

    <input type="submit"  name="确定"> <br>




</form>


</body>
</html>

 

 

 

 SpringBoot和thymeleaf在IntelliJ IDEA中实现热部署

1.File–Settings–Compiler-- --> 勾选 build project automatically–ok

2.CTRL + SHIFT + A --> 查找Registry --> 找到并勾选compiler.automake.allow.when.app.running

3、加maven依赖

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-devtools</artifactId>
    <optional>true</optional>
</dependency>

4、退出idea,重新打开。

经过上面4步,修改前端的静态文件不需重启重启项目就生效。
 

举报

相关推荐

0 条评论