转换layUI的数据表格中的日期格式方法


Posted in Javascript onSeptember 19, 2019

转换layUI的数据表格中的日期格式

前端jsp代码

转换layUI的数据表格中的日期格式方法

<table class="layui-table" style="width:100%" lay-data="{url:'/why123/user/findUserAll?userType=0', page:true, id:'idTest'}" lay-filter="demo">
 <thead>
 <tr>
  <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
  <th lay-data="{field:'userName',align:'center'}">用户名</th>
  <th lay-data="{field:'gender',align:'center',width:80}">性别</th>
  <th lay-data="{field:'mobile',align:'center'}">手机号码</th>
  <th lay-data="{field:'email',align:'center'}">电子邮箱</th>
  <th lay-data="{field:'userheat',align:'center',width:100,sort:'true'}">人气</th>
  <th lay-data="{field:'regDate',align:'center',templet:'<div>{{ layui.laytpl.toDateString(d.regDate) }}</div>'}">注册时间</th>
  <th lay-data="{field:'lastLogin',align:'center',templet:'<div>{{ layui.laytpl.toDateString(d.lastLogin) }}</div>'}">最后一次登录时间</th>
  <th lay-data="{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}">操作</th>
 </tr>
 </thead>
</table>

js代码:

layui.use('laytpl', function(){
 var laytpl = layui.laytpl;
 //时间戳的处理
 layui.laytpl.toDateString = function(d, format){
 if(d==null||d==''){
  return "未登录";
 }else{
 var date =new Date(d.time) 
 ,ymd = [
  this.digit(date.getFullYear(), 4)
  ,this.digit(date.getMonth() + 1)
  ,this.digit(date.getDate())
 ]
 ,hms = [
  this.digit(date.getHours())
  ,this.digit(date.getMinutes())
  ,this.digit(date.getSeconds())
 ];
 
 format = format || 'yyyy-MM-dd HH:mm:ss';
 
 return format.replace(/yyyy/g, ymd[0])
 .replace(/MM/g, ymd[1])
 .replace(/dd/g, ymd[2])
 .replace(/HH/g, hms[0])
 .replace(/mm/g, hms[1])
 .replace(/ss/g, hms[2]);
 }
 }
 //数字前置补零
 layui.laytpl.digit = function(num, length, end){
 var str = '';
 num = String(num);
 length = length || 2;
 for(var i = num.length; i < length; i++){
  str += '0';
 }
 return num < Math.pow(10, length) ? str + (num|0) : num;
 };
 });

注意:

1、需引入laytpl模块

2、后台返回json的String类型,否则如果数据为空,会出错,错误如下:

net.sf.json.JSONException: Object is null
 net.sf.json.JSONNull.isEmpty(JSONNull.java:69)
 sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
 sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
 sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
 java.lang.reflect.Method.invoke(Method.java:606)
 com.fasterxml.jackson.databind.ser.BeanPropertyWriter.serializeAsField(BeanPropertyWriter.java:536)
 com.fasterxml.jackson.databind.ser.std.BeanSerializerBase.serializeFields(BeanSerializerBase.java:663)
 com.fasterxml.jackson.databind.ser.BeanSerializer.serialize(BeanSerializer.java:156)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serializeFields(MapSerializer.java:557)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serialize(MapSerializer.java:466)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serialize(MapSerializer.java:29)
 com.fasterxml.jackson.databind.ser.std.CollectionSerializer.serializeContents(CollectionSerializer.java:132)
 com.fasterxml.jackson.databind.ser.std.CollectionSerializer.serialize(CollectionSerializer.java:94)
 com.fasterxml.jackson.databind.ser.std.CollectionSerializer.serialize(CollectionSerializer.java:24)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serializeFields(MapSerializer.java:557)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serialize(MapSerializer.java:466)
 com.fasterxml.jackson.databind.ser.std.MapSerializer.serialize(MapSerializer.java:29)
 com.fasterxml.jackson.databind.ser.DefaultSerializerProvider.serializeValue(DefaultSerializerProvider.java:251)
 com.fasterxml.jackson.databind.ObjectWriter.writeValue(ObjectWriter.java:846)
 org.springframework.http.converter.json.AbstractJackson2HttpMessageConverter.writeInternal(AbstractJackson2HttpMessageConverter.java:286)
 org.springframework.http.converter.AbstractGenericHttpMessageConverter.write(AbstractGenericHttpMessageConverter.java:106)
 org.springframework.web.servlet.mvc.method.annotation.AbstractMessageConverterMethodProcessor.writeWithMessageConverters(AbstractMessageConverterMethodProcessor.java:231)
 org.springframework.web.servlet.mvc.method.annotation.RequestResponseBodyMethodProcessor.handleReturnValue(RequestResponseBodyMethodProcessor.java:174)
 org.springframework.web.method.support.HandlerMethodReturnValueHandlerComposite.handleReturnValue(HandlerMethodReturnValueHandlerComposite.java:81)
 org.springframework.web.servlet.mvc.method.annotation.ServletInvocableHandlerMethod.invokeAndHandle(ServletInvocableHandlerMethod.java:113)
 org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter.invokeHandlerMethod(RequestMappingHandlerAdapter.java:827)
 org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter.handleInternal(RequestMappingHandlerAdapter.java:738)
 org.springframework.web.servlet.mvc.method.AbstractHandlerMethodAdapter.handle(AbstractHandlerMethodAdapter.java:85)
 org.springframework.web.servlet.DispatcherServlet.doDispatch(DispatcherServlet.java:967)
 org.springframework.web.servlet.DispatcherServlet.doService(DispatcherServlet.java:901)
 org.springframework.web.servlet.FrameworkServlet.processRequest(FrameworkServlet.java:970)
 org.springframework.web.servlet.FrameworkServlet.doGet(FrameworkServlet.java:861)
 javax.servlet.http.HttpServlet.service(HttpServlet.java:624)
 org.springframework.web.servlet.FrameworkServlet.service(FrameworkServlet.java:846)
 javax.servlet.http.HttpServlet.service(HttpServlet.java:731)
 org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52)
 org.springframework.web.filter.CharacterEncodingFilter.doFilterInternal(CharacterEncodingFilter.java:197)
 org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerRequestFilter.java:107)

以上这篇转换layUI的数据表格中的日期格式方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
才发现的超链接js导致网页中GIF动画停止的解决方法
Nov 02 Javascript
IFrame跨域高度自适应实现代码
Aug 16 Javascript
javascript中使用正则表达式清理table样式的代码
Apr 01 Javascript
原生JS实现的放大镜效果实例代码
Oct 15 Javascript
canvas实现粒子时钟效果
Feb 06 Javascript
在 Angular 中实现搜索关键字高亮示例
Mar 21 Javascript
vue 中directive功能的简单实现
Jan 05 Javascript
JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】
Mar 15 Javascript
Bootstrap table中toolbar新增条件查询及refresh参数使用方法
May 18 Javascript
Vue+mui实现图片的本地缓存示例代码
May 24 Javascript
Vue-不允许嵌套式的渲染方法
Sep 13 Javascript
JS页面获取 session 值,作用域和闭包学习笔记
Oct 16 Javascript
js 判断当前时间是否处于某个一个时间段内
Sep 19 #Javascript
vue-froala-wysiwyg 富文本编辑器功能
Sep 19 #Javascript
关于layui toolbar和template的结合使用方法
Sep 19 #Javascript
深入理解javascript prototype的相关知识
Sep 19 #Javascript
基于Vue的商品主图放大镜方案详解
Sep 19 #Javascript
vue 实现模糊检索并根据其他字符的首字母顺序排列
Sep 19 #Javascript
微信小程序错误this.setData报错及解决过程
Sep 18 #Javascript
You might like
xajax写的留言本
2006/11/25 PHP
在smarty模板中使用PHP函数的方法
2011/04/23 PHP
for循环连续求和、九九乘法表代码
2012/02/20 PHP
php 模拟get_headers函数的代码示例
2013/04/27 PHP
php中JSON的使用方法
2015/04/30 PHP
一个简单安全的PHP验证码类 附调用方法
2016/06/24 PHP
php正则提取html图片(img)src地址与任意属性的方法
2017/02/08 PHP
解决PHP上传非标准格式的图片pjpeg失败的方法
2017/03/12 PHP
PHP中PDO事务处理操作示例
2018/05/02 PHP
JavaScript 继承详解(二)
2009/07/13 Javascript
js截取中英文字符串、标点符号无乱码示例解读
2014/04/17 Javascript
JS使用正则表达式除去字符串中重复字符的方法
2015/11/05 Javascript
3分钟掌握常用的JS操作JSON方法总结
2017/04/25 Javascript
jquery 输入框查找关键字并提亮颜色的实例代码
2018/01/23 jQuery
nodejs简单读写excel内容的方法示例
2018/03/16 NodeJs
详解React+Koa实现服务端渲染(SSR)
2018/05/23 Javascript
ng-zorro-antd 入门初体验
2018/12/03 Javascript
微信小程序自定义组件传值 页面和组件相互传数据操作示例
2019/05/05 Javascript
微信小程序HTTP请求从0到1封装
2019/09/09 Javascript
Python Mysql数据库操作 Perl操作Mysql数据库
2009/01/12 Python
全面解读Python Web开发框架Django
2014/06/30 Python
Python字符串拼接、截取及替换方法总结分析
2016/04/13 Python
Python文件操作基本流程代码实例
2017/12/11 Python
Python从零开始创建区块链
2018/03/06 Python
python中的turtle库函数简单使用教程
2018/07/23 Python
详解python多线程之间的同步(一)
2019/04/03 Python
简单了解Python3里的一些新特性
2019/07/13 Python
kafka监控获取指定topic的消息总量示例
2019/12/23 Python
Pycharm中使用git进行合作开发的教程详解
2020/11/17 Python
数据库什么时候应该被重组
2012/11/02 面试题
大专生简历的自我评价
2013/11/26 职场文书
谢师宴家长答谢词
2015/09/30 职场文书
标会主持词应该怎么写?
2019/08/15 职场文书
pytorch 6 batch_train 批训练操作
2021/05/28 Python
详解Redis基本命令与使用场景
2021/06/01 Redis
Win10多屏显示如何设置?Win10电脑多屏显示设置操作方法
2022/07/07 数码科技