layui框架中格式化table中的日期时间数据
1、遇到问题:
在使用layui框架时,后台返回的日期数据一个长整形的数据,因此要把数据格式化成 yyyy-MM-dd HH:mm:ss
的形式
2、后台返回的数据:
sbj_start
在后台是java.util.Date
类型的数据,响应到前端是一个很长的数字
3、日期数据格式化Demo
只需要在table中的日期字段后面加上templet : "<div>{{layui.util.toDateString(d.sbj_start, 'yyyy-MM-dd HH:mm:ss')}}</div>"
即可
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui表格渲染,时间问题</title>
<link rel="stylesheet" href="./css/layui.css" media="all">
<script src="./js/layui.all.js"></script>
<style type="text/css">
body{overflow-y: scroll;}
</style>
</head>
<body>
<table id="demo" lay-filter="test"></table>
<script>
layui.use('table', function(){
var table = layui.table;
//第一个实例
table.render({
elem: '#demo'
,height: 315
,url: 'http://localhost:8080/oes/teacher/examlist.do' //数据接口
,page: true //开启分页
,cols: [[ //表头
{field:
、、、省略数据、、、、
,{field: 'date', title: '日期', templet : "<div>{{layui.util.toDateString(d.sbj_start, 'yyyy年-MM月-dd日 HH:mm:ss')}}</div>"}
]]
});
});
</script>
</body>
</html>
4、显示结果
5、注意事项
- 日期的格式化形式可以有很多种,可以参考layui官网日期format
- layui.util.toDateString(d.【写后台返回json的字段名】,【日期格式】)
如:layui.util.toDateString(d.sbj_start, 'yyyy年-MM月-dd日 HH:mm:ss')
如果上述的第一个参数有错误,会自动格式化当前日期时间
,只有跟table
中的field
的值一样时,才会格式化后台返回的日期时间数据