关于ssm+maven后台操作layui数据表格显示和分页使用方法

提问 已结
9 193
你微笑时好丶美
悬赏:20飞吻
版本:layui 2.3 浏览器:谷歌
关于ssm+maven后台操作layui数据表格显示和分页使用方法,我是个新手小白,自学搞个后台,前后端的交互不知道怎么搞,后端不太知道编码,求求源码,或者详细的教程。我卡在这里好几天了,我急啊[生病] [泪]
回帖
  • 引入Maven依赖
    <!--引入pageHelper分页插件 -->
    <dependency>
    <groupId>com.github.pagehelper</groupId>
    <artifactId>pagehelper</artifactId>
    <version>5.0.0</version>
    </dependency>
    <!-- fastjson Json相关 -->
    <dependency>
    <groupId>com.alibaba</groupId>
    <artifactId>fastjson</artifactId>
    <version>1.2.47</version>
    </dependency>
    后端可以编写一个实体类
    @Data
    public class LayuiResult<T> {
    private int code;
    private long count;
    private List<T> data;
    private String msg;
    }
    由于我这里使用MyBatis的PageHelper分页插件需要在mybatis-config.xml里面配置
    <plugins>
    <plugin interceptor="com.github.pagehelper.PageInterceptor">
    <!--分页参数合理化 -->
    <property name="reasonable" value="true"/>
    </plugin>
    </plugins>
    contorller的代码
    @GetMapping(value = "/user/getusers", produces = "application/json; charset=utf-8")
    @ResponseBody
    public String getUsers(@RequestParam("page") Integer pageNum, @RequestParam("limit") Integer pageSize) {
    //PageHelper分页插件开始分页:pageNum页数,pageSize行数
    PageHelper.startPage(pageNum, pageSize);
    //取出分页数据
    List<Sys_user> userList = sys_userService.findUsers();
    //开始转换Layui数据接口格式
    LayuiResult layuiJson = new LayuiResult();
    layuiJson.setCode(0);
    PageInfo page = new PageInfo(userList);
    layuiJson.setMsg("数据接口错误");
    Long count = page.getTotal();
    layuiJson.setCount(count.intValue());
    layuiJson.setData(userList);
    return FastJsonUtil.getBeanToJson(layuiJson);
    }
    前端代码
    //执行一个 table 实例
    table.render({
    elem: '#test'
    , height: 600
    , url: basePath + 'getAll.do' //数据接口
    , page: true //开启分页
    , cols: [[ //表头
    {field: 'bookid', title: 'ID', width: 80, sort: true, fixed: 'left'}
    , {field: 'bookname', title: '书名', width: 200}
    , {field: 'bookauthor', title: '作者', width: 100}
    , {field: 'bookpublish', title: '出版社', width: 170}
    , {field: 'bookpage', title: '页数', width: 80, sort: true}
    , {field: 'bookprice', title: '价格', width: 80, sort: true}
    , {field: 'createdate', title: '时间', width: 200, sort: true}
    , {fixed: 'right', width: 170, align: 'center', toolbar: '#barDemo'}
    ]]
    });
    1 回复
  • 1.ssm和maven没必然的联系,你用gradle不也一样…
    2.编码你指encoding?
    3.前后端交换随便找个example里的例子就有了
    像是admin.req(主动)
    table.render(初始化)的例子
    0 回复
  • @KazeNariRio 我想找找源码看看呀,你有没有啊[泪]
    0 回复
  • @你微笑时好丶美
    Java返回的实体类里的data和网页上render里的cols ->filed一一对应就好了
    0 回复
  • 是 cols ->field
    0 回复
  • 上面的前端代码来源不同项目。只做参考。
    0 回复
  • @海默症疯子 , url: basePath + 'getAll.do' //数据接口 这个数据接口我不理解
    0 回复
  • @你微笑时好丶美 前端的代码是另一个示例的
    url: basePath + '/user/getusers' //数据接口     这个才是发送到后端的请求路径。  
    实在不了解加我QQ1635936133。示例发你
    0 回复
  • 萧萧i
    2018-10-9
    github 搜素 layaui ssm 项目 多得是哦
    0 回复