layui + springboot + mybatis 开发小tips

于 2023-04-20 21:41:56 发布
阅读量363 收藏
点赞数
文章标签： spring boot mybatis layui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_46304590/article/details/130272892
版权

使用layui 和 mybatis+springboot的一些心得：
1.超链接到controller
<a href="#" th:href="@{/stu/toReserve}">预约实验</a>
2.layui独特的监听标志 lay-filter
3.select选择框动态加载：

$.getJSON("http://localhost:8080/getDepartmentList",function(d){

	if(d.status == 1){
			layer.msg(d.msg);
		}
		else{
			var list = d.data;
			var str = "<option value=''></option>";
			for(var i=0;i<list.length;i++){
				str += "<option value=\"" + list[i]+"\">" + list[i] + "</option>";
			}
	
			$("#department").html(str);
			form.render("select");
		}
	})

4.检测到select变化之后更改checkbox状态：

form.on('select(week)',function(data){
	console.log("检测到select变化");
	$('#demo input[type=checkbox]:checked').each(function () {
           $(this).prop('checked', false);
                
    });
	// $('#lala').prop('disabled',true);
		form.render('checkbox');

});

5.引入样式表和外部文件的时候需要两次引入，一次动态加载，一次静态加载：

	<!--动态-->
    <link rel="stylesheet" href="../layui/css/layui.css">
    <script src="../layui/layui.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/login.css">
    <!--静态调试-->
    <link rel="stylesheet" type="text/css" href="../static/layui/css/layui.css">
    <script type="text/javascript" src="../static/layui/layui.js"></script>
    <link rel="stylesheet" type="text/css" href="../static/css/login.css">

6.id选择器监听按钮状态，若成功按下，目标页面转发到controller层进行路由转发：

$("#register").click(function () {
            window.location.href=("http://localhost:8080/toRegister");
 })

7.$.getJSON(url,parameterList,function(){})对应于springboot的@getMapping注解；
或者写为：get(url,parameterList,function(){},"JSON");
$.post(url,parameterList,function(){})对应于springboot的@postMapping注解；
其中get的url中会暴露请求参数，post不会；
8. table.render中分页的参数更改：
（1）

request:{
        pageName:'pageNo',
        limitName:'pageSize'
},//原本table给的参数是pageName，在此处更改为了pageNo，limitName更改为了pageSize；

（2）

where:{
       tea_id: '1001'
}//自定义参数，可以传递给后端

（3）

parseData: function(res){ //res 即为原始返回的数据
                console.log("res->getReserveRecordById",res);
                return {
                    "code": res.status, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.msg, //解析数据长度
                    "data": res.data //解析数据列表
                };
            }`

parseData可以解析你后端传送过来的数据，如你的名称叫做res.status,但是他需要的是code，就可以如此转换。
（4）

{
       title:"操作",
       align:'center',
       templet:function(){
            var str = "<button type=\"button\" class=\"layui-btn layui-btn-sm layui-btn-danger\" lay-event='del'>删除</button>";
             str += "<button type=\"button\" class=\"layui-btn layui-btn-sm layui-btn-warm\" lay-event='edit'>编辑</button>";
                        return str;
       },
      width:180,
      align: "center"
}

在表格中添加按钮可以采用如上方式。基本就是字符串拼接。
9.打开一个子窗口并且回显：

layer.open({
     type:2,
     title:'更新学生信息',
     content:['/labManager/toUpdateStu', 'yes'],
     area:["500px","400px"],
     closeBtn:2,
     shade:0.1,
     end: function(){
         table.reload("showStudent");
     },
     success: function(layero, index){
         console.log(obj.data.stu_gender);
         var body = layer.getChildFrame('body',index);
		 body.find("#stu_name").val(obj.data.stu_name); //id选择器（常规操作）
		 body.find("#stu_num").val(obj.data.stu_num);	
		 body.find("#classroom").val(obj.data.stu_class);	                        			
		 body.find("#id").val(obj.data.id);
	     var setTime = setTimeout(function () {}, 1000); //有时候异步加载回显不成功，就加载一个延时可以起到一定效果   			                                             
                        //部门回显
		body.find("input[name='gender'[value=false]").attr("checked",obj.data.stu_gender==false?true:false);//checkbox的回显写起来会有点不同

		}
})

10.springboot的resources文件夹这样放，其中templates一定要叫templates不能少了s，项目启动首先寻找templates文件夹下的index.html文件，因此建议把index.html直接放在templates文件夹下，项目运行直接输入网址http://localhost:8080即可；当然yml的配置也有很多文章，讲一下我遇到的：

Spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/labreserve?serverTimezone=GMT%2B8&useUnicode=true&characterEncoding=utf8
    username: root
    password: '123456'
  http:
    encoding:
    force: true
    charset: UTF-8
    enabled: true

  jpa:
    hibernate:
      ddl-auto: update
    show-sql: true
    thymeleaf:
      cache: false
      prefix: classpath:/templates/  /*thymeleaf前缀
      suffix: .html			/*thymeleaf后缀
    web:
      resources:
        static-locations: classpath:/resources/,classpath:/static/,classpath:/templates/
mybatis:
  mapper-locations: classpath:mapping/*.xml
  type-aliases-package: com.example.labreservesystem.bean
  configuration:
    call-setters-on-nulls: true
    map-underscore-to-camel-case: false//驼峰命名法是否开启
pagehelper:
  reasonable: true
  support-methods-arguments: true
  params: count=countSql
  helper-dialect: mysql
server:
  tomcat:
    uri-encoding: UTF-8

驼峰命名法这个最开始我的数据库查找一直会有某些值是空的，一直不知道原因，后面发现为了和数据库字段一样，我的实体类命名也用了下划线，因此这些字段的值都是空的，比如stu_info在开启驼峰命名法的情况下会自动变成stuInfo,因此字段不匹配不会取到数据。
11.mybatis取到数据后可以采用数据库字段与实体类字段匹配的方法，也可以采用resultMap的对应方法：

<resultMap id="ReserveByTea" type="com.example.labreservesystem.bean.po.ReserveByTea">
        <!--主键的映射关系 column:列名（数据库列名） property:属性名（与实体类类名一致）-->
        <id column="tea_reserve_record_id" property="id"/>
        <!--普通列的映射关系-->
        <result column="is_passed" property="isPassed"/>
        <result column="department" property="department"/>
        <result column="laboratory" property="laboratory"/>
        <result column="tea_id" property="teaId"/>
        <result column="class_time" property="classTime"/>
        <result column="trial_name" property="trialName"/>
        <result column="trial_num" property="trialNum"/>
        <result column="trial_times" property="trialTimes"/>
        <result column="week" property="week"/>
        <result column="day" property="day"/>
        <result column="course" property="course"/>
    </resultMap>

12.在Mapper层中传递一个实体类给mybatis作为参数采用注解@Param：

 //学生预约详情加入
    Boolean addReserveByStu(@Param("reserveByStu") ReserveByStu reserveByStu);

然后在mapping里的参数就这样写<insert id="addReserveByStu" parameterType="com.example.labreservesystem.bean.po.ReserveByStu">。
13.实体类或者参数尽量不要采用基本类型，采用对象类型，如int变为Integer，boolean变为Boolean等；
14.分页可以采用这样的方式，先用一个实体类存储起始条数和查询参数，这里运用了范式编程思想：
实体类：

public class PageUtils<T> {
    private Integer startIndex;
    private Integer pageSize;
    private T data;

    public PageUtils(Integer startIndex, Integer pageSize, T data) {
        this.startIndex = startIndex;
        this.pageSize = pageSize;
        this.data = data;
    }

    public Integer getStartIndex() {
        return startIndex;
    }

    public void setStartIndex(Integer startIndex) {
        this.startIndex = startIndex;
    }

    public Integer getPageSize() {
        return pageSize;
    }

    public void setPageSize(Integer pageSize) {
        this.pageSize = pageSize;
    }

    public T getData() {
        return data;
    }

    public void setData(T data) {
        this.data = data;
    }

    @Override
    public String toString() {
        return "PageUtils{" +
                "startIndex=" + startIndex +
                ", pageSize=" + pageSize +
                ", data=" + data +
                '}';
    }
}

T就作为参数传递进去，可以是String，也可以是一个类，也可以是集合等等。在mybatis里就可以这样写：

 <!--获取我的学生信息-->
    <select id="getMyStudent" parameterType="com.example.labreservesystem.bean.vo.PageUtils" resultType="com.example.labreservesystem.bean.po.Student">
        select *from student_info left join stu_tea_semester sts on student_info.stu_num = sts.stu_num
        where tea_id = #{pageUtils.data.tea_id} and trial_name = #{pageUtils.data.trial_name}
        limit #{pageUtils.startIndex},#{pageUtils.pageSize}
    </select>

（此处T是一个类）
15.关于controller层的返回值可以采用自定义一个类的方式，我的也是采用网上找到的方法，经久耐用，非常方便：

/**
 * @author
 */
@JsonSerialize(include = JsonSerialize.Inclusion.NON_NULL)
public class ServerResponse<T> implements Serializable {

    private int status;
    private String msg;
    private T data;

    private ServerResponse(int status) {
        this.status = status;
    }

    private ServerResponse(int status, T data) {
        this.status = status;
        this.data = data;
    }

    private ServerResponse(int status, String msg, T data) {
        this.status = status;
        this.msg = msg;
        this.data = data;
    }

    private ServerResponse(int status, String msg) {
        this.status = status;
        this.msg = msg;
    }

    @JsonIgnore
    public boolean isSuccess() {
        return this.status == 0;
    }

    public int getStatus() {
        return status;
    }

    public T getData() {
        return data;
    }

    public String getMsg() {
        return msg;
    }

    public static <T> ServerResponse<T> createBySuccess() {
        return new ServerResponse<T>(0);
    }

    public static <T> ServerResponse<T> createBySuccessMessage(String msg) {
        return new ServerResponse<T>(0, msg);
    }

    public static <T> ServerResponse<T> createBySuccess(T data) {
        return new ServerResponse<T>(0, data);
    }

    public static <T> ServerResponse<T> createBySuccess(String msg, T data) {
        return new ServerResponse<T>(0, msg, data);
    }

    public static <T> ServerResponse<T> createByError() {
        return new ServerResponse<T>(1, "失败");
    }

    public static <T> ServerResponse<T> createByErrorMessage(String errorMessage) {
        return new ServerResponse<T>(1, errorMessage);
    }

    public static <T> ServerResponse<T> createByErrorCodeMessage(int errorCode, String errorMessage) {
        return new ServerResponse<T>(errorCode, errorMessage);
    }
}

具体在controller的使用为：

  /*
 教师得到自身预约信息
  */
   @GetMapping("/getReserveRecordById")
   @ResponseBody
    public ServerResponse getReserveRecordById(Integer pageNo, Integer pageSize,String tea_id) {
        PageUtils<String> pageUtils = new PageUtils<String>((pageNo-1)*pageSize,pageSize,tea_id);
        List<ReserveEnsure> reserveEnsureList = teacherService.getReserveRecordById(pageUtils);
        return ServerResponse.createBySuccess(reserveEnsureList);
    }

16.如果注解是只有@getMapping，则运用thymleaf返回的是一个页面或字符串：

 /*
    前往预约选择页面
     */
    @GetMapping("/toReserve")
    public String ToReserve() throws IOException {
        System.out.println("/toReserve");
        return "Student/show_CanReserve";//这个是一个html页面
    }

如果注解是@getMapping和@Responsebody,则返回一个JSON字符串。

 /*
    获取预约记录
    */
    @GetMapping("/getReserveRecord")
    @ResponseBody
    public ServerResponse getReserveRecord(String stu_num,Integer pageNo,Integer pageSize) throws IOException {
        System.out.println("/getReserveRecord");
        PageUtils<String> pageUtils = new PageUtils<String>((pageNo-1)*pageSize,pageSize,stu_num);
        try{
            List<ReserveByStu> reserveByStus = studentService.getReserveRecord(pageUtils);
            return ServerResponse.createBySuccess(reserveByStus);
        }
        catch (NullPointerException e){
            e.printStackTrace();
        }
        return ServerResponse.createByError();
    }

未解决问题，session怎么使用，还在找问题，为什么用了springboot后HttpSession session 作为参数传递总是报错，报错内容为HttpSession为接口，无法实例化。百思不得其解。如有解决办法，也会更新。

星仔007
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值