SpringBoot超详细笔记（整合SSM附源码）

引言：

       本文主要分享了有关SpringBoot相关的知识，包括：SpringBoot的简介、SpringBoot环境的搭建、简单是SpringBoot案例、lombok的简单应用、在SpringBoot中加入HTML页面时的操作、SpringBoot的目录解析、SpringBoot整合SSM_html+vue+jquery（附源码）、thymeleaf模板的简述及使用、SpringBoot整合SSM_thymeleaf（附源码）；

文章目录

1. SpringBoot简介

       SpringBoot设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置，从而使开发人员不再需要定义样板化的配置；SpringBoot不是一门新技术，只是将Spring、SpringMVC等封装起来，就是一个工具集；

SpringBoot特点：

  • 不需要模板化的配置
  • 整合三方框架时，只需要导入相应的starter依赖包，会自动整合
  • 默认只有一个.properties是我配置文件
  • 部署工程时采用的是jar包的方式，内部自动依赖Tomcat容器，提供了多环境的配置
  • SpringCloud需要建立在SpringBoot的基础上

2. SpringBoot环境的搭建

2.1 首先创建Maven项目

创建Maven项目

2.2 GVA坐标

GAV坐标

GAV坐标

2.3 在Maven项目中加入SpringBoot

加入springboot

2.4 选择构建项目的类型_aliyun

填入aliyun网址

2.5 项目描述

编写目录

2.6 指定SpringBoot版本和需要的依赖

本项目选择2.1.14版本，加入了Lombok、Spring Web、Thymeleaf依赖

添加依赖

2.7 编写Controller

编写代码

2.8 项目运行

2.8.1 运行启动类的main方法

在这里插入图片描述

运行成功

2.8.2 maven命令

mvn spring-boot:run

2.9 结果界面

运行成功

3. lombok应用_慎用

3.1 lombok简介

          lombok是一个可以通过简单的注解的形式来帮助我们简化消除一些Java类中的大量样板代码，lombok能够达到的效果就是在源码中不需要写一些通用的方法，但是在编译生成的字节码文件中会帮我们生成这些方法；

3.2 添加IDEA对lombok的支持

在setting中搜索lombok，安装

在这里插入图片描述

3.3 部分注解的使用

  • @Setter：生成Setting方法
  • @Getter：生成Getter方法
  • @NoArgsConstructor：生成无参构造
  • @AllArgsConstructor：生成有参构造
  • @Data ：代替@Setter、@Getter、toString

4. 加入HTML页面

4.1 编写index.html

resources/templates下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML页面</title>
</head>
<body>
<h2>SpringBoot Html View</h2>
<form action="add" method="POST">
    UserName:<input type="text" name="username"/><br/>
    Password:<input type="password" name="password"/><br/>
    Tel:<input type="text" name="tel"/><br/>
    <input type="submit" value="add"/>
</form>
</body>
</html>

4.2 编写success页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成功界面</title>
</head>
<body>
<h2>数据交互成功</h2>
</body>
</html>

4.3 编写初始化页面

当访问localhost:8080时显示该页面

package com.sx.kak.controller;

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

/**
 * Created by Kak on 2020/8/31.
 */
@Controller
public class PageController {
    @RequestMapping("/")
    public String showIndex(){
        return "index";
    }
}

4.4 编写UserInfo

package com.sx.kak.vo;
import lombok.*;

/**
 * Created by Kak on 2020/8/31.
 */

@NoArgsConstructor  //生成无参构造
@AllArgsConstructor //生成有参构造
@Data   //代替@Setter、@Getter、toString
public class UserInfo {
    private String username;
    private String password;
    private String tel;
}

4.5 编写UserInfoController

package com.sx.kak.controller;

import com.sx.kak.vo.UserInfo;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
@Controller
public class UserInfoController {
    //接收表单数据
    @RequestMapping(value="add",method=RequestMethod.POST)
    public String getUserInfo(UserInfo userInfo){
        System.out.println(userInfo);
        return "success";
    }

    //全查
    @RequestMapping("/userInfo")
    @ResponseBody
    public ResponseEntity<List<UserInfo>> findUser(){
        ArrayList<UserInfo> list = new ArrayList<>();
        list.add(new UserInfo("kaka1","123456","123456"));
        list.add(new UserInfo("kaka2","123456","123456"));
        list.add(new UserInfo("kaka3","123456","123456"));
        return new ResponseEntity<List<UserInfo>>(list, HttpStatus.OK);
    }
}

4.6 结果界面

表单数据

成功传入后台

5. SpringBoot的目录结构

目录结构

6. xml与html的区别联系

xml与html区别与联系：

  • 联系：二者均可以使用浏览器解析，都在内存中形成dom模型
  • 区别：
    1. xml：只能有一个root（根）节点
    2. xml：自定义标记；而html预定义标记
    3. xml：区分大小写，html不区分
    4. xml：中标记的属性值必须使用引号，而html可以不用
    5. xml：标记必须关闭；而html可以不关闭
    6. xml：不可以交叉嵌套

7. SpringBoot整合SSM_html+vue+jquery

在这里插入图片描述

7.1 创建数据库

CREATE TABLE student(
	id INT PRIMARY KEY AUTO_INCREMENT,
	NAME VARCHAR(50) NOT NULL,
	sex VARCHAR(10) DEFAULT 'man',
	age VARCHAR(5)
) CHARSET = utf8;

7.2 编写实体类

在po包下编写实体类

package com.sx.kak.po;

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

/**
 * Created by Kak on 2020/8/31.
 */
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Student {
    private int id;
    private String name;
    private String sex;
    private String age;

}

7.3 编写StudentMapper.java

在mapper中编写StudentMapper

package com.sx.kak.mapper;

import com.sx.kak.po.Student;

import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */

public interface StudentMapper {
    public List<Student> findAll();
    public Student findOneById(int id);
    public void addStudent(Student student);
    public void updateStudent(Student student);
    public void deleteStudent(int id);
}

7.4 编写StudentMapper.xml

在resources/mapping下编写

<?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.sx.kak.mapper.StudentMapper">
    <select id="findAll" resultType="com.sx.kak.po.Student">
        select id,name,sex,age from student
    </select>

    <select id="findOneById" parameterType="int" resultType="com.sx.kak.po.Student">
        SELECT id,name,sex,age FROM student WHERE id=#{id}
    </select>

    <insert id="addStudent" parameterType="com.sx.kak.po.Student">
        insert into student (id,name,sex,age) VALUES (#{id},#{name},#{sex},#{age})
    </insert>

    <update id="updateStudent" parameterType="com.sx.kak.po.Student">
        UPDATE student set name=#{name},sex=#{sex},age=#{age} WHERE id=#{id}
    </update>

    <delete id="deleteStudent" parameterType="int">
        DELETE FROM student where id=#{id}
    </delete>
</mapper>

7.5 修改SpringbootSsmApplication

设置mapper扫描基础包路径

package com.sx.kak;

import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
//设置mapper扫描基础包路径
@MapperScan(basePackages = {"com.sx.kak.mapper"})
public class SpringbootSsmApplication {
    public static void main(String[] args) {
        SpringApplication.run(SpringbootSsmApplication.class, args);
    }

}

7.6 编写StudentService

在service下

package com.sx.kak.server;

import com.sx.kak.po.Student;
import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
public interface StudentService {
    public List<Student> findAllService();
    public Student findOneStudentService(int id);
    public void addStudentService(Student student);
    public void updateStudentService(Student student);
    public void deleteStudentService(int id);
}

7.7 编写StudentServiceImpl

在service/impl下

package com.sx.kak.server.impl;

import com.sx.kak.mapper.StudentMapper;
import com.sx.kak.po.Student;
import com.sx.kak.server.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
@Service//标注service实现对象有spring接管
public class StudentServiceImpl implements StudentService{
    //注入mapper接口
    @Autowired(required = false)
    private StudentMapper studentMapper;

    @Override
    public List<Student> findAllService() {
        List<Student> all = studentMapper.findAll();
        return all;
    }

    @Override
    public Student findOneStudentService(int id) {
        Student oneById = studentMapper.findOneById(id);
        return oneById;
    }

    @Override
    public void addStudentService(Student student) {
        studentMapper.addStudent(student);
    }

    @Override
    public void updateStudentService(Student student) {
        studentMapper.updateStudent(student);
    }

    @Override
    public void deleteStudentService(int id) {
        studentMapper.deleteStudent(id);
    }
}

7.8 编写ViewController

用于视图跳转

package com.sx.kak.controller;

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

/**
 * Created by Kak on 2020/8/31.
 */
@Controller
public class ViewController {
    @RequestMapping("/studentView")
    public String showList(){
        return "showAllStudent";
    }

    @RequestMapping("/addStudent")
    public String addStudent(){
        return "addStudent";
    }
}

7.9 编写StudentController

业务控制层

package com.sx.kak.controller;

import com.sx.kak.po.Student;
import com.sx.kak.server.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
@Controller
public class StudentController {
    //注入service接口
    @Autowired(required = false)
    private StudentService studentService;

    //全查
    @RequestMapping(value = "/students",method = RequestMethod.GET)
    @ResponseBody
    public ResponseEntity<List<Student>> findAllStu(){
        List<Student> allService = studentService.findAllService();
        if(allService!=null){
            return new ResponseEntity<List<Student>>(allService, HttpStatus.OK);
        }else {
            return new ResponseEntity<List<Student>>(allService, HttpStatus.NOT_FOUND);
        }
    }

    //增加
    @RequestMapping(value = "addStudents",method = RequestMethod.POST)
    public String addStu(Student student){
        studentService.addStudentService(student);
        return "redirect:studentView";
    }

    //单查
    @RequestMapping(value = "findByIdStudents",method = RequestMethod.GET)
    @ResponseBody
    public ResponseEntity<Student> findByIdStu(@RequestParam("id") int id){
        Student oneStudentService = studentService.findOneStudentService(id);
        if(oneStudentService!=null){
            return new ResponseEntity<Student>(oneStudentService, HttpStatus.OK);

        }else{
            return new ResponseEntity<Student>( HttpStatus.NOT_FOUND);
        }
    }
    //修改
    @RequestMapping(value = "/updateStudents",method = RequestMethod.POST)
    @ResponseBody
    public ResponseEntity<Student> updateStu(@RequestBody Student student){
        System.out.println(student);
        studentService.updateStudentService(student);
        return  new ResponseEntity<Student>(HttpStatus.OK);
    }

    //删除
    @RequestMapping(value = "deleteStudents",method = RequestMethod.GET)
    @ResponseBody
    public ResponseEntity<Student> deleteStu(@RequestParam("id") int id){
        studentService.deleteStudentService(id);
        return  new ResponseEntity<Student>(HttpStatus.OK);
    }
}

7.10 编写showAllStudent

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生全查页面</title>
</head>

<script src="../js/jquery-3.3.1.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="js/vue.min.js"></script>
<link href="../css/bootstrap.min.css" rel="stylesheet">

<body>
<div id="findAll">
    <table cellspacing="1" border="1">
        <tr>
            <th>ID</th>
            <th>NAME</th>
            <th>SEX</th>
            <th>AGE</th>
            <th>Action</th>
        </tr>
        <tr v-for="s in students">
            <td> {{s.id}}</td>
            <td> {{s.name}}</td>
            <td> {{s.age}}</td>
            <td> {{s.sex}}</td>
            <td>
                <button type="button" @click="findOneById(s.id)">修改</button>
                <button type="button" @click="delectStudent(s.id)">删除</button>
            </td>
        </tr>
    </table>
    <a href="addStudent">增加</a>
</div>

<!--model wiondows模态 窗体-->
<div class="modal" id="modalModify">
    <div class="model-dialog" >
        <!--窗体部分-->
        <div class="modal-content">
            <!--头部-->
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">X</button>
                <h4 class="modal-title">学生信息修改：</h4>
            </div>
            <!--躯干-->
            <div class="modal-body">
                <table id="table2" align="center">
                    <tr style="height:40px;">
                        <td align="right"><label>学生编号:</label>&nbsp;&nbsp;&nbsp;</td>
                        <td><input type="text" name="id" class="form-control" readonly v-model="s.id" /></td>
                    </tr>
                    <tr style="height:40px;">
                        <td align="right"><label>学生姓名:</label>&nbsp;&nbsp;&nbsp;</td>
                        <td><input type="text" name="name" class="form-control"  v-model="s.name" /></td>
                    </tr>
                    <tr style="height:40px;">
                        <td align="right"><label>学生性别:</label>&nbsp;&nbsp;&nbsp;</td>
                        <td><input type="text" name="sex" class="form-control"  v-model="s.sex" /></td>
                    </tr>
                    <tr style="height:40px;">
                        <td align="right"><label>学生年龄:</label>&nbsp;&nbsp;&nbsp;</td>
                        <td><input type="text" name="age" class="form-control"  v-model="s.age" /></td>
                    </tr>
                </table>
            </div>
            <!--尾部-->
            <div class = "modal-footer">
                <button type="button" class="btn btn-default" data-dismiss ="modal">取消</button>
                <button type="button" class="btn btn-primary" id="updateStu">修改</button>
            </div>
        </div>
    </div>
</div>
</body>

<script>
    var updates = new Vue({
       el:'#table2' ,
        data:{
           s:"",
        },
    });
    var myObj = new Vue({
        el: '#findAll',
        data: {
            students: []
        },
        methods: {
            findOneById: function (id) {
                alert(id);
                $.ajax({
                    type: "get",
                    url: "/findByIdStudents?id=" + id,
                    dataType: "json",
                    success: function (data) {
                        console.log(data);
                        updates.s = data;
                    }
                });
                $("#modalModify").modal("show");

            },
            delectStudent:function(id) {
                $.ajax({
                    type: "get",
                    url: "/deleteStudents?id=" + id,
//                    dataType: 'json',
                    success: function (data) {
                        showStudent();
                    }
                });
            }
        }
    });

    $("#updateStu").click(function () {
        alert("发送请求"+JSON.stringify(updates.s));
        $.ajax({
            url:"/updateStudents",
            type:"post",
            data: JSON.stringify(updates.s),
            contentType:'application/json',
//            dataType:"json",
            success:function (data) {
                alert("修改成功!");
                $("#modalModify").modal("hide");//关闭窗体
                showStudent();
            }
        });
    });

    $(function(){
        showStudent();

    });
    function showStudent() {
        $.ajax({
            url: 'students',
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                myObj.students = data;
            }
        })
    }
</script>
</html>

7.11 编写addStudent

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>增加页面</title>
</head>
<body>
<form action="addStudents" method="POST">
    ID:<input type="text" name="id"/><br/>
    NAME:<input type="text" name="name"/><br/>
    SEX:<input type="text" name="sex"/><br/>
    AGE:<input type="text" name="age"/><br/>
    <input type="submit" value="add"/>
</form>
</body>
</html>

7.12 结果展示

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

8. thymeleaf

8.1 thymeleaf简介

         Thymeleaf是一个适用于Web和独立环境的现代服务器端Java模板引擎，可以处理HTML、XML、JavaScript、CSS等；目的是提供优雅且高度可维护的模板创建方式，提供spring标准方言和一个与 SpringMVC 完美集成的可选模块，可以快速的实现表单绑定、属性编辑器等功能；

8.2 thymeleaf应用

8.2.1 需加入依赖

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

8.2.2 增加头文件

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

8.2.3 动态替换掉静态数据

可以用th标签动态替换掉静态数据

<!--thymeleaf操作-->
<tr th:each="s:${students}">
            <td th:text="${s.id}"></td>
            <td th:text="${s.name}"></td>
            <td th:text="${s.sex}"></td>
            <td th:text="${s.age}"></td>
            <td>
                <a href="findByIdStudents?id=10" th:href="@{findByIdStudents(id=${s.id})}">修改</a>
                <a href="deleteStudents?id=10" th:href="@{deleteStudents(id=${s.id})}">删除</a>
            </td>
        </tr>

<!--vue操作-->
<tr v-for="s in students">
    <td> {{s.id}}</td>
    <td> {{s.name}}</td>
    <td> {{s.age}}</td>
    <td> {{s.sex}}</td>
    <td>
        <button type="button" @click="findOneById(s.id)">修改</button>
        <button type="button" @click="delectStudent(s.id)">删除</button>
    </td>
</tr>

9. SpringBoot整合SSM_thymeleaf

在这里插入图片描述

9.1 创建数据库

CREATE TABLE student(
	id INT PRIMARY KEY AUTO_INCREMENT,
	NAME VARCHAR(50) NOT NULL,
	sex VARCHAR(10) DEFAULT 'man',
	age VARCHAR(5)
) CHARSET = utf8;

9.2 编写实体类

在po包下编写实体类

package com.sx.kak.po;

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

/**
 * Created by Kak on 2020/8/31.
 */
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Student {
    private int id;
    private String name;
    private String sex;
    private String age;
}

9.3 编写StudentMapper.java

在mapper中编写StudentMapper

package com.sx.kak.mapper;

import com.sx.kak.po.Student;

import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */

public interface StudentMapper {
    public List<Student> findAll();
    public Student findOneById(int id);
    public void addStudent(Student student);
    public void updateStudent(Student student);
    public void deleteStudent(int id);
}

9.4 编写StudentMapper.xml

在resources/mapping下编写

<?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.sx.kak.mapper.StudentMapper">
    <select id="findAll" resultType="com.sx.kak.po.Student">
        select id,name,sex,age from student
    </select>

    <select id="findOneById" parameterType="int" resultType="com.sx.kak.po.Student">
        SELECT id,name,sex,age FROM student WHERE id=#{id}
    </select>

    <insert id="addStudent" parameterType="com.sx.kak.po.Student">
        insert into student (id,name,sex,age) VALUES (#{id},#{name},#{sex},#{age})
    </insert>

    <update id="updateStudent" parameterType="com.sx.kak.po.Student">
        UPDATE student set name=#{name},sex=#{sex},age=#{age} WHERE id=#{id}
    </update>

    <delete id="deleteStudent" parameterType="int">
        DELETE FROM student where id=#{id}
    </delete>
</mapper>

9.5 修改SpringbootSsmApplication

设置mapper扫描基础包路径

package com.sx.kak;

import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
//设置mapper扫描基础包路径
@MapperScan(basePackages = {"com.sx.kak.mapper"})
public class SpringbootSsmApplication {
    public static void main(String[] args) {
        SpringApplication.run(SpringbootSsmApplication.class, args);
    }

}

9.6 编写StudentService

在service下

package com.sx.kak.server;

import com.sx.kak.po.Student;
import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
public interface StudentService {
    public List<Student> findAllService();
    public Student findOneStudentService(int id);
    public void addStudentService(Student student);
    public void updateStudentService(Student student);
    public void deleteStudentService(int id);
}

9.7 编写StudentServiceImpl

在service/impl下

package com.sx.kak.server.impl;

import com.sx.kak.mapper.StudentMapper;
import com.sx.kak.po.Student;
import com.sx.kak.server.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
@Service//标注service实现对象有spring接管
public class StudentServiceImpl implements StudentService{
    //注入mapper接口
    @Autowired(required = false)
    private StudentMapper studentMapper;

    @Override
    public List<Student> findAllService() {
        List<Student> all = studentMapper.findAll();
        return all;
    }

    @Override
    public Student findOneStudentService(int id) {
        Student oneById = studentMapper.findOneById(id);
        return oneById;
    }

    @Override
    public void addStudentService(Student student) {
        studentMapper.addStudent(student);
    }

    @Override
    public void updateStudentService(Student student) {
        studentMapper.updateStudent(student);
    }

    @Override
    public void deleteStudentService(int id) {
        studentMapper.deleteStudent(id);
    }
}

9.8 编写StudentController

业务控制层

package com.sx.kak.controller;

import com.sx.kak.po.Student;
import com.sx.kak.server.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;

import java.util.List;

/**
 * Created by Kak on 2020/8/31.
 */
@Controller
public class StudentController {
    //注入service接口
    @Autowired(required = false)
    private StudentService studentService;

    @RequestMapping("/addStudentView")
    public String addStudent(){
        return "addStudent";
    }
    //全查
    @RequestMapping(value = "/students",method = RequestMethod.GET)
    public String findAllStu(Model model){
        List<Student> allService = studentService.findAllService();
        model.addAttribute("students",allService);
       return "showAllStudent";
    }

    //增加
    @RequestMapping(value = "addStudents",method = RequestMethod.POST)
    public String addStu(Model model,Student student){
        studentService.addStudentService(student);
        return "redirect:students";
    }

    //单查
    @RequestMapping(value = "findByIdStudents",method = RequestMethod.GET)
    public String findByIdStu(Model model,int id){
        Student oneStudentService = studentService.findOneStudentService(id);
        model.addAttribute("student",oneStudentService);
        return "updateStudent";
    }
    //修改
    @RequestMapping(value = "/updateStudents",method = RequestMethod.POST)
    public String updateStu(Model model,Student student){
        studentService.updateStudentService(student);
        return  "redirect:students";
    }

    //删除
    @RequestMapping(value = "deleteStudents",method = RequestMethod.GET)
    public String deleteStu(Model model, int id){
        studentService.deleteStudentService(id);
        return  "redirect:students";
    }
}

9.9 编写showAllStudent

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>学生全查页面</title>
</head>

<body>
<div id="findAll">
    <table>
        <tr>
            <th>ID</th>
            <th>NAME</th>
            <th>SEX</th>
            <th>AGE</th>
            <th>Action</th>
        </tr>
        <tr th:each="s:${students}">
            <td th:text="${s.id}"></td>
            <td th:text="${s.name}"></td>
            <td th:text="${s.sex}"></td>
            <td th:text="${s.age}"></td>
            <td>
                <a href="findByIdStudents?id=10" th:href="@{findByIdStudents(id=${s.id})}">修改</a>
                <a href="deleteStudents?id=10" th:href="@{deleteStudents(id=${s.id})}">删除</a>
            </td>
        </tr>
    </table>
    <a href="addStudentView">增加</a>
</div>
</body>
</html>

9.10 编写addStudent

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>增加页面</title>
</head>
<body>
<form th:action="@{addStudents}" method="POST" th:object="${addStu}">
    ID:<input type="text" name="id"/><br/>
    NAME:<input type="text" name="name"/><br/>
    SEX:<input type="text" name="sex"/><br/>
    AGE:<input type="text" name="age"/><br/>
    <input type="submit" value="add"/>
</form>
</body>
</html>

9.11 编写updateStudent

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>修改页面</title>
</head>
<body>
<form th:action="@{updateStudents}" method="POST" th:object="${student}">
    ID:<input type="text" name="id" readonly th:field="*{id}"/><br/>
    NAME:<input type="text" name="name" th:field="*{name}"/><br/>
    SEX:<input type="text" name="sex" th:field="*{sex}"/><br/>
    AGE:<input type="text" name="age" th:field="*{age}"/><br/>
    <input type="submit" value="update"/>
</form>
</body>
</html>

9.12 结果展示

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

# spring # java # spring boot
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Vue里echarts根据页面大小动态调整/自适应

Vue里echarts根据页面大小动态调整/自适应

avatar Vue