SMM框架整合layui关于数据表格返回对象属性的显示

一般来说我们使用layui的数据表格的时候需要返回这样的数据结构：
这里写图片描述
但是我们使用SSM框架时候通过@ResponseBody返回对象的json串时候会包含这样的数据结构：

public class Course {
    private Integer courseLong;
    private Integer courseAge;
    private Integer newNum;
    private String remark;
    private Type type;
    private Teacher teacher;
}

其中Type和Teacher是一对多的关联表，所以我们返回的数据是包含这些对象的属性的，如果正常获取的时候我们需要${teacher.username}这样获取的，但是layui是无法进行解析的，那怎么办呢？
第一步：先创建一个工具类：

public class JoinTable {

    private Integer courseId;

    private String courseName;

    private String courseTime;

    private String courseAddress;

    private String courseMoney;

    private Integer courseLong;

    private Integer courseAge;

    private String typeName;

    private String username;
}

注意需要添加get、set、构造方法的！
第二步：修改mybatis的需要的表的 *.xml 文件

<select id="selectByExampleJoin" resultType="com.youth.pojo.JoinTable">
    select
    <if test="distinct">
      distinct
    </if>
    <include refid="Base_Column_List_Join" />
    from course a
    join type c on c.type_id = a.type_id
    join teacher b on b.teacher_id = a.teacher_id
  </select>

注意返回类型 resultType 需要时我们创建的那个工具类！
第三步：修改service和mapper：

// 返回联查信息
List<JoinTable> selectByExampleJoin();

/**
 * @function 返回联查信息
 * @return
 */
public List<JoinTable> getAll(){
    return mapper.selectByExampleJoin();
}

第四步：修改controller：

/**
 * @function 分页显示课程数据数据
 * @param page
 * @param limit
 * @return
 */
@RequestMapping(value = "/page", method = RequestMethod.GET)
@ResponseBody
public LayerMsg page_list(@RequestParam(value = "page", defaultValue = "1") Integer page, @RequestParam(value = "limit", defaultValue = "9") Integer limit){
    System.out.println("page:"+page+", "+"limit:"+limit);
    PageHelper.startPage(page, limit);
    List<JoinTable> lists = courseService.getAll();
    PageInfo pages = new PageInfo(lists, limit);
    return LayerMsg.success(pages.getTotal(), pages.getList());
}

这样就可以！
看一下前台的代码：

table.render({
    elem: '#test'
    ,url:'/course/page'
    ,cellMinWidth: 80
    ,cols: [[
        {field:'courseId', width:'5%', title: 'ID', sort: true}
        ,{field:'typeName', width:'10%', title: '课程类型'}
        ,{field:'courseName', width:'10%', title: '课程名称'}
        ,{field:'courseTime', width:'16%', title: '上课时间'}
        ,{field:'courseAddress', title: '课程教室', width:'9%'} //minWidth：局部定义当前单元格的最小宽度，layui 2.2.1 新增
        ,{field:'courseMoney', title: '收费标准', width:'14%'}
        ,{field:'courseLong', title: '课程时长', width:'8%'}
        ,{field:'username', title: '授课老师' , width:'9%'}
        ,{field:'courseAge', width:'6%', title: '年龄'}
        ,{fixed: 'right', title: '操作', align:'center', toolbar: '#barDemo', width:'13%'}
    ]]
    ,page:true
    ,limit: 9
    ,even: true //开启隔行背景
    ,size: 'sm' //小尺寸的表格
});

网上看有一个博客是通过thymeleaf的{{#}}修改的，但是我没成功，所以只能改java后台的代码了！

SMM框架整合layui关于数据表格返回对象属性的显示

猜你喜欢