SpringMVC RESTFul 案例

Students Mr sun

已于 2022-04-18 17:41:44 修改

阅读量257

点赞数

文章标签： spring

于 2022-04-18 16:10:11 首次发布

本文链接：https://blog.csdn.net/qq_37138380/article/details/124244859

版权

1、准备工作和传统 CRUD 一样，实现对员工信息的增删改查。

2.搭建环境参照： https://mp.csdn.net/mp_blog/creation/editor/124198537

准备实体类

dao层：

package com.sun.mvc.dao;

import com.sun.mvc.bean.Employee;
import org.springframework.stereotype.Repository;

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

/**
 * @author sunyc
 * @create 2022-04-18 11:21
 */
@Repository
public class EmployeeDao {
    private static Map<Integer, Employee> employees = null;
    static{
        employees = new HashMap<Integer, Employee>();
        employees.put(1001, new Employee(1001, "E-AA", "aa@163.com", 1));
        employees.put(1002, new Employee(1002, "E-BB", "bb@163.com", 1));
        employees.put(1003, new Employee(1003, "E-CC", "cc@163.com", 0));
        employees.put(1004, new Employee(1004, "E-DD", "dd@163.com", 0));
        employees.put(1005, new Employee(1005, "E-EE", "ee@163.com", 1));
    }
    private static Integer initId = 1006;
    //保存 ，添加和修改
    public void save(Employee employee){
        if(employee.getId() == null){
            employee.setId(initId++);
        }
        employees.put(employee.getId(), employee);
    }
    //获取所有数据
    public Collection<Employee> getAll(){
        return employees.values();
    }
    //根据id查找对应的数据
    public Employee get(Integer id){
        return employees.get(id);
    }
    //根据id查删除数据
    public void delete(Integer id){
        employees.remove(id);
    }


}

需要实现的功能：

控制层：

package com.sun.mvc.contorller;

import com.sun.mvc.bean.Employee;
import com.sun.mvc.dao.EmployeeDao;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import java.util.Collection;

/**
 * @author sunyc
 * @create 2022-04-18 11:18
 */
@Controller
public class EmployeeContorller {
    @Autowired
    private EmployeeDao employeeDao;
    //index1 页面
    @RequestMapping("/")
    public String index(){
        return "index1";
    }
    //员工信息  employee_list1.html
    @RequestMapping(value = "/employee",method = RequestMethod.GET)
    public String index(Model model){
        Collection<Employee> all = employeeDao.getAll();
        model.addAttribute("emplist",all);
        return "employee_list1";//跳到员工信息页面
    }
    //删除完成后跳到"/employee" 页面   employee_list1.html
    @RequestMapping(value = "/employee/{id}",method = RequestMethod.DELETE)
    public String deleteId(@PathVariable("id") Integer id){
        employeeDao.delete(id);
        return "redirect:/employee";//重定向到员工列表
    }
    //添加完成后跳到"/employee" 页面  employee_list1.html
    @RequestMapping(value = "/employee",method = RequestMethod.POST)
    public String employeeAdd(Employee employee){
        employeeDao.save(employee);
        return "redirect:/employee";//重定向到员工列表
    }
    //跳转到添加用户数据页面  employee_list1.html
    @RequestMapping(value = "/toAdd",method = RequestMethod.GET)
    public String toAdd(Employee employee){
        return "employee_add1";//跳转到员工添加页面
    }

    //根据id获取需要更新的数据并回现到更新页面做修改  employee_list1.html
    @RequestMapping(value = "/employee/{id}", method = RequestMethod.GET)
    public String getEmployeeById(@PathVariable("id") Integer id, Model model){
        Employee employee = employeeDao.get(id);
        model.addAttribute("emplist", employee);
        return "employee_update1";//跳转到员工修改页面
    }
    //更新更新也的数据数据  employee_update1.html
    @RequestMapping(value = "/employee", method = RequestMethod.PUT)
    public String updateEmployee(Employee employee){
        employeeDao.save(employee);
        return "redirect:/employee";//重定向到员工列表
    }

}

首页：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" >
    <title>Title</title>
</head>
<body>
<h1>首页</h1>
<a th:href="@{/employee}">访问员工信息</a>
</body>
</html>

员工信息添加页 :

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form th:action="@{/employee}" method="post">

    lastName:<input type="text" name="lastName"><br/>
    email:<input type="text" name="email"><br/>
    gender:<input type="radio" name="gender" value="1">male
           <input type="radio" name="gender" value="0">female<br/>
    <input type="submit" value="add"><br/>

</form>
</body>
</html>

员工信息页；

注意其中静态资源的加载：

需要重新打包加载到target中

并在SPringMVC.xml配置中添加：

如果DispatcherServlet控制器处理不了，那么就有defaultservler来处理
 <!--开放对静态资源的访问-->
    <mvc:default-servlet-handler/>
    <!-- 开启mvc注解驱动 -->
    <mvc:annotation-driven>
        <mvc:message-converters>
            <!-- 处理响应中文内容乱码 -->
            <bean
                    class="org.springframework.http.converter.StringHttpMessageConverter">
                <property name="defaultCharset" value="UTF-8" />
                <property name="supportedMediaTypes">
                    <list>
                        <value>text/html</value>
                        <value>application/json</value>
                    </list>
                </property>
            </bean>
        </mvc:message-converters>
    </mvc:annotation-driven>

员工信息页；


<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Employee Info</title>
</head>
<body>

<table id="dataTable" border="1" cellspacing="0" cellpadding="0" style="text-align: center;">
    <tr>
        <th colspan="5">Employee Info</th>
    </tr>
    <tr>
        <th>id</th>
        <th>lastName</th>
        <th>email</th>
        <th>gender</th>
        <th>options（<a th:href="@{/toAdd}">add</a>）</th>
    </tr>
    <tr th:each="employee : ${emplist}">
        <td th:text="${employee.id}"></td>
        <td th:text="${employee.lastName}"></td>
        <td th:text="${employee.email}"></td>
        <td th:text="${employee.gender}"></td>
        <td>
            <a @click="deleteEmployee" th:href="@{'/employee/'+${employee.id}}">delete</a>
            <a th:href="@{'/employee/'+${employee.id}}">update</a>
        </td>
    </tr>
</table>

<form id="deleteForm" method="post">
    <input type="hidden" name="_method" value="delete">
</form>

<script type="text/javascript" th:src="@{/static/js/vue.js}"></script>
<script type="text/javascript">
    var vue = new Vue({
        el:"#dataTable",
        methods:{
            deleteEmployee:function (event) {
                //根据id获取表单元素
                var deleteForm = document.getElementById("deleteForm");
                //将触发点击事件的超链接的href属性赋值给表单的action
                deleteForm.action = event.target.href;
                //提交表单
                deleteForm.submit();
                //取消超链接的默认行为
                event.preventDefault();
            }
        }
    });
</script>
</body>
</html>

员工更新页：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form th:action="@{/employee}" method="post">
    <input type="hidden" name="_method" value="PUT">
    id:<input type="text" name="id" th:value="${emplist.id}"><br/>
    lastname:<input type="text" name="lastName" th:value="${emplist.lastName}"><br/>
    email:<input type="text" name="email" th:value="${emplist.email}"><br/>
    <!--
    th:field="${employee.gender}"可用于单选框或复选框的回显
    若单选框的value和employee.gender的值一致，则添加checked="checked"属性
    -->
    gender:<input type="radio" name="gender" value="1" th:field="${emplist.gender}">
    <input type="radio" name="gender" value="0" th:field="${emplist.gender}"><br/>

    <input type="submit" value="提交或更新">

</form>
</body>
</html>

如上全部完成

按照我自己想法其中删除用户改动如下；

控制层：

  //删除完成后跳到"/employee" 页面   employee_list1.html
    @RequestMapping(value = "/employeedelete/{id}")
    public String deleteId2(@PathVariable("id") Integer id){
        System.out.println("哼哼哈嘿");
        employeeDao.delete(id);
        return "redirect:/employee";//重定向到员工列表
    }

用户信息页：
<tr th:each="employee : ${emplist}">
        <td th:text="${employee.id}"></td>
        <td th:text="${employee.lastName}"></td>
        <td th:text="${employee.email}"></td>
        <td th:text="${employee.gender}"></td>
        <td>
            <a th:href="@{'/employeedelete/'+${employee.id}}">delete</a>
            <a th:href="@{'/employee/'+${employee.id}}">update</a>
        </td>
    </tr>

Students Mr sun

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SpringMVC RESTFul 案例

1、准备工作和传统 CRUD 一样，实现对员工信息的增删改查。2.搭建环境参照：https://mp.csdn.net/mp_blog/creation/editor/124198537准备实体类dao层：package com.sun.mvc.dao;import com.sun.mvc.bean.Employee;import org.springframework.stereotype.Repository;import java.util.Collection;im.
复制链接

扫一扫