脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → java → SpringMVC RESTFul删除

SpringMVC RESTFul实战案例删除功能实现

 更新时间：2022年05月28日 14:55:18   作者：把苹果咬哭的测试笔记  
这篇文章主要为大家介绍了SpringMVC RESTFul实战案例删除功能实现，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪

SpringMVC RESTFul实现删除功能

删除相对麻烦一点，因为 Rest 中得用 delete 方法请求。

在前面已经提到如何实现 delete 和 put 方法请求了，这里同样借助表单来提交 post 请求，然后转成 delete 请求方法。

一、修改列表前端代码

1. 修改删除的请求地址

Rest 中删除的请求地址应该是/employee/id}，所以列表按钮【删除】对应超链接要改：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>员工信息</title>
</head>
<body>
    <table border="1" cellspacing="0" cellpadding="0" style="text-align: center;">
        <tr>
            <th colspan="5">员工列表</th>
        </tr>
        <tr>
            <th>id</th>
            <th>lastName</th>
            <th>email</th>
            <th>gender</th>
            <th>options</th>
        </tr>
        <!--循环后端放到request域中的数据 employeeList-->
        <tr th:each="employee : ${employeeList}">
            <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="@{/employee/} + ${employee.id}" rel="external nofollow"  rel="external nofollow" >删除</a>
                <a href="">更新</a>
            </td>
        </tr>
    </table>
</body>
</html>

这里仍然采用拼接的方式@{/employee/} + ${employee.id}，这样 thymeleaf 才可以正确解析。

部署后，鼠标移动到删除按钮查看下浏览器左下角。

2. 添加删除用的 form 表单

添加删除用的 form 表单，用来实际发送请求。

<!--发送删除请求用的表单-->
    <form method="post">
        <input type="hidden" name="_method" value="delete">
    </form>

注意 HiddenHttpMethodFilter 的要求：必须传输 _method 请求参数，并且值为最终的请求方式，这里的 value 就是 delete 。

3. 删除超链接绑定点击事件

要点击执行删除，所以超链接要绑定点击事件，引入vue.js 。

在 webapp 下新建一个static\js，用于存放静态文件。网上下载一个 vue.js，放到这个文件夹下。

接着，在前端代码中引入：

<!--引入 vue.js-->
    <script type="text/javascript" th:src="@{/static/js/vue.min.js}"></script>

修改列表中删除按钮的超链接，绑定一个 click 事件：

<!--循环后端放到request域中的数据 employeeList-->
        <tr th:each="employee : ${employeeList}">
            <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}" rel="external nofollow"  rel="external nofollow" >删除</a>
                <a href="">更新</a>
            </td>
        </tr>

继续编写 js 处理这个绑定事件，为了方便用元素js获取到元素，要给删除表单添加一个id="delete_form"：

<script type="text/javascript">
        var vue = new Vue({
            el: "#data_table", // 之前要给列表加个id="data_table"，方便获取
            methods: {
                //event表示当前事件
                deleteEmployee: function (event) {
                    //通过id获取表单标签
                    var delete_form = document.getElementById("delete_form");
                    //将触发事件的超链接的 href 属性为表单的 action 属性赋值
                    delete_form.action = event.target.href;
                    //提交表单
                    delete_form.submit();
                    //阻止超链接的默认跳转行为
                    event.preventDefault();
                }
            }
        })
    </script>

delete_form.action = event.target.href; 值就是触发事件的超链接的 href 里的值，也就是 th:href="@{/employee/} + ${employee.id}"。

因为我们点击删除按钮后，就是要去访问这个请求。

二、增加后端控制器

编写后端控制器方法，处理删除请求：

@RequestMapping(value = "/employee/{id}", method = RequestMethod.DELETE)
    public String deleteEmployee(@PathVariable("id") Integer id) {
        employeeDao.delete(id);
        return "redirect:/employee";
    }

这里因为要传入 id 值，所以使用占位符，并且方法的请求方式为DELETE。

另外，最后 return 要使用重定向，返回到列表页。因为删除之后其实就跟/employee/{id}这个请没关系了，如果使用转发到列表页，浏览器地址栏里显示的仍然还是/employee/{id}。

三、测试效果

部署运行，点击删除测试一下，发现报错了。

说明写的绑定事件没生效，为啥没生效？因为找不到 vue.min.js 的资源。

这里要注意下，可以点开 idea 看下 target 下如果这里没有对应的 static，没有的话需要重新打包一下。

找到这里，重新打包。

解决完重新部署，如果访问发现还是报错 404 。

看下控制台，发现静态资源是被 springMVC 处理的，实际上处理不了，找不到资源自然就报错了。

增加配置

现在需要在springMVC.xml 配置文件中添加配置，开放静态资源的访问：

<!--放开静态资源的访问-->
    <mvc:default-servlet-handler />

这时候，当 springMVC 找不到的时候，就会交给 default-servlet去找，而不会像上面那样报 404 错误。

现在重新部署，访问列表页。

点击删除，删除成功。

以上就是SpringMVC RESTFul实战案例删除功能实现的详细内容，更多关于SpringMVC RESTFul删除的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

相关文章

  • 登陆验证码kaptcha结合spring boot的用法详解

    登陆验证码kaptcha结合spring boot的用法详解

    在一个web应用中验证码是一个常见的元素。不管是防止机器人还是爬虫都有一定的作用，下面这篇文章主要给大家介绍了登陆验证码kaptcha结合spring boot用法的相关资料，需要的朋友可以参考借鉴，下面来一起看看吧。
    2017-06-06
  • MyBatis-Plus自动化填充的踩坑记录及解决

    MyBatis-Plus自动化填充的踩坑记录及解决

    这篇文章主要介绍了MyBatis-Plus自动化填充的踩坑记录及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2023-03-03
  • 如何解决springmvc文件下载,内容损坏的问题

    如何解决springmvc文件下载,内容损坏的问题

    这篇文章主要介绍了解决springmvc文件下载，内容损坏的问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2021-06-06
  • 深入浅出学习AQS组件

    深入浅出学习AQS组件

    AQS ( AbstractQueuedSynchronizer)是一个用来构建锁和同步器的框架，使用AQS能简单且高效地构造出应用广泛的大量的同步器，下面小编和大家来一起学习一下吧
    2019-05-05
  • spring boot实战教程之shiro session过期时间详解

    spring boot实战教程之shiro session过期时间详解

    这篇文章主要给大家介绍了关于spring boot实战教程之shiro session过期时间的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
    2017-10-10
  • 使用java模拟简单的tomcat的方法详解

    使用java模拟简单的tomcat的方法详解

    这篇文章主要为大家详细介绍了java模拟简单的tomcat的方法，使用数据库，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2022-02-02
  • mybatis中返回多个map结果问题

    mybatis中返回多个map结果问题

    这篇文章主要介绍了mybatis中返回多个map结果问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2022-06-06
  • Java获取支付宝OpenID的实现方法

    Java获取支付宝OpenID的实现方法

    在Java中,通过支付宝开放平台API可以获取用户的OpenID,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2024-09-09
  • JAVA基础-GUI

    JAVA基础-GUI

    这篇文章主要介绍了JAVA中关于GUI的相关知识，文中代码非常详细，供大家参考和学习，感兴趣的朋友可以了解下
    2020-06-06
  • SpringBoot thymeleaf实现饼状图与柱形图流程介绍

    SpringBoot thymeleaf实现饼状图与柱形图流程介绍

    这篇文章主要介绍了SpringBoot thymeleaf实现饼状图与柱形图流程，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧
    2022-12-12

最新评论