知识点4--spring boot实现三层架构-删除

本篇知识点延续知识点2的项目，实现删除数据操作，在正式的内容前，先完善之前的几个小问题。

问题一：spring boot的框架实现了强封装，甚至在我们SSM时写的大量的无实际业务的service、dao层代码都封装成了自带的方法直接调用就可以，但是并不是说不能自己写了，只是无必须写自定义代码才可解决的复杂业务时，我们调用方法就行

问题二：知识点2中的分页查询，有个Bug，点击尾页的时候无法成功跳转到尾页，这是由于国内用的JDK一般是8，比较老这和springboot新版本存在不协调的问题，最新的JDK都到17+了，导致在controller层跳转到前端的时候分页对象中总页数丢失了，解决这个问题的方法很简单，我们将pages单独存储并调用就行了。

@RequestMapping("/list")
    public String list(HttpServletRequest request, @RequestParam(defaultValue = "1") long current, @RequestParam(defaultValue = "3") long size, User user){
        //创建分页对象
        Page<User> page =new Page<>(current,size);
        //创建查询条件对象
        QueryWrapper<User> wrapper = new QueryWrapper<>();
        //执行分页查询
        IPage<User> pageInfo = userService.page(page, wrapper);
        //单独存储总页数
        request.setAttribute("pages",pageInfo.getPages());
        //存储到request中
        request.setAttribute("pageInfo",pageInfo);
        return "/user_list";
    }

问题三：在前端list页面中，分页功能，下一页存在bug，当当前页是尾页的时候，下一页超出，这个我们使用freemaker的三目运算符限制下一页就行

<td colspan="10" center>
   <a href="/user/list?current=1">首页</a>
   <a href="/user/list?current=${pageInfo.current-1}">上一页</a>
   <a href="/user/list?current=${(pageInfo.current+1>=pages)?string(pages,pageInfo.current+1)}">下一页</a>
   <a href="/user/list?current=${pages}">尾页</a>
</td>

问题四：前端静态资源需要修改一下配置，不然后面的开发无法正常的获取静态资源

spring.web.resources.static-locations=classpath:/static/**
spring.mvc.static-path-pattern=classpath:/static/**

---

接下来，进行本篇知识点的功能的开发，本篇目的为完成基于列表的删除功能

第一步：我们的删除依赖于JS，因此需要将js的资源文件放入静态资源下，js包大家用自己的即可

第二步：在列表页面，完成删除的JS事件开发

在head中导入JS

<script type="text/javascript" src="/js/jquery-3.2.1.js"></script>

给列表中的标签定义类选择器的依据

<td><input type="checkbox" class="chbx" value="${user.id?c}"/></td>

在Body标签内，末尾编写JS代码

<script>
    function deleteByIds(){
        var ids = $(".chbx:checked").map(function(){
            return this.value;
        }).get().join(",");

        if(ids!=""){
            var flag = window.confirm("你确定要删除选中的数据吗?");
            if(flag){
                deleteById(ids);
            }else{
                alert("取消删除");
            }
        }else{
            window.alert("请选择要删除的数据");
        }
    }

    function deleteById(ids){
        $.post('../user/delete',{ids:ids},function(data){
            if(data){
                alert("删除成功")
                window.location.reload();
            }else{
                alert("删除失败");
            }
        },"json");
    }
</script>

在合适的地方添加批量删除选项，并且连同列表展示代码中的单独删除，绑定js事件

<a href="javascript:deleteByIds()">批量删除</a>
<a href="javascript:deleteById(${user.id?c})">删除</a>

这里解释一下?c，它是freemaker的内建函数，作用是将一个字符串的数据转换为数字展示，一般用不到，因为前后端交互传值都是字符串

第三步：开发Controller层，在UserController中开发

@RequestMapping("/delete")
@ResponseBody
public boolean delete(Long ids[]){
    return iUserService.removeByIds(Arrays.asList(ids));
}

到此开发完成，大家运行看效果即可

---

最后说两个问题

第一个：list页面中，在列表头中的复选框道理上将应该有全选功能，因此需要补充如下JS

$("#chb").click(function (){
    $(".chbx").prop("checked",this.checked);
})

并给表头中的复选框一个id

<th><input type="checkbox" id="chb"/></th>

第二个：由于spring boot高封装，底层大量的应用了反射，所以操作的流程中最好保持数据类型的一致，不然会报类型异常，这里给大家返现一下这种问题，我们想controller中删除方法的形参类型变成其他的，比如变成普通的long类型，不用包装类

这个时候你在执行删除的时候就会报类型异常的错

这个时候又会有人说，这是否是普通类型向包装类反射时自动装载受影响，那么我们将形参类型再变为Integer

在执行删除的时候会发现可以正常删除，但是我们不能这么写，因为数据库中用的是bigint，它的长度只适合Long，我们在User的Bean实体中也是用的Long，如果你在这里用Integer，那么如果这是一个要上线的系统那这就成了一个隐患，当未来某一天，id返回超过2147483648时，这个系统就炸了，而且这种bug还不好找。

第三个：如果操作的数据中有时间字段我们要知道如何操作，下面提供一个例子

首先在表中添加一个时间字段

那么在User的Bean实例中一定要使用格式注解

/**
* 生日
*/
@DateTimeFormat(pattern = "yyyy-MM-dd")
private Date brith;

前端展示的时候，freemaker中写

<td>
    <#if user.brith??>
        ${user.brith?string("yyyy-MM-dd")}
    <#else>
    </#if>
</td>

??在freemaker中时一个内建函数，作用是判断是否为空，不为空则返回真

效果如下

第四点：不要被freemaker的小东西吓到，它本质上也还是html只不过很多东西编了个样而已，而且它没有jsp那样庞大，在我的博客中是用到那些就顺带说了，但其实完全可以在官网找到这个对应的所有指令、内建函数等帮助文档，官网地址也给大家，不动的取看看 https://freemarker.apache.org/docs/dgui_quickstart_basics.html

到此本篇知识点讲解结束，此外 本次整体讲解的spring boot项目已上传github