解决layui数据表格Date日期格式的回显Object的问题


Posted in Javascript onSeptember 19, 2019

有属性: private Date createtime;

但是回显的时候,显示{ Object object },想要转换成字符串格式显示。

layui中显示:

在对应的实体类中添加属性:private String createtimestr;

然后添加对应的set/get方法,但是方法处理的是createtime

但是在Mybatis-plus框架映射时,数据库表里面又没有该字段,获取数据的时候会报异常,unknown field "createtimestr" in table ,

解决办法,在添加的属性上面添加注解 @TableField(exist = false)

用于表示表中没有该字段,不然报错。

最后就是

方法二:

在前端页面创建处理时间的函数:

<!--转换时间格式-->
<script type="text/javascript">
 function dateToStr(date) {
 var time = new Date(date.time);
 var y = time.getFullYear();
 var M = time.getMonth() + 1;
 M = M < 10 ? ("0" + M) : M;
 var d = time.getDate();
 d = d < 10 ? ("0" + d) : d;
 var h = time.getHours();
 h = h < 10 ? ("0" + h) : h;
 var m = time.getMinutes();
 m = m < 10 ? ("0" + m) : m;
 var s = time.getSeconds();
 s = s < 10 ? ("0" + s) : s;
 var str = y + "-" + M + "-" + d + " " + h + ":" + m + ":" + s;
 console.log(str);
 return str;
 }
</script>

然后再模板输出

{field: 'createtime', title: '发布时间',sort: true, minWidth: 100,templet:'<div>{{dateToStr(d.createtime)}}</div>'}

或者

{field: 'createtime', title: '发布时间',sort: true, minWidth: 100,templet:function (d) {
 return dateToStr(d.createtime);
 }}

还有就是,时间对象里面会有个 time 时间戳属性,可以通过 new Date(xxx.time),即可。

以上这篇解决layui数据表格Date日期格式的回显Object的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
模拟用户操作Input元素,不会触发相应事件
May 11 Javascript
js控制input框只读实现示例
Jan 20 Javascript
一个可以增加和删除行的table并可编辑表格中内容
Jun 16 Javascript
充分发挥Node.js程序性能的一些方法介绍
Jun 23 Javascript
node.js版本管理工具n无效的原理和解决方法
Nov 24 Javascript
使用JavaScript解决网页图片拉伸问题(推荐)
Nov 25 Javascript
angularjs中的$eval方法详解
Apr 24 Javascript
js表单序列化判断空值的实例
Sep 22 Javascript
VS Code转换大小写、修改选中文字或代码颜色的方法
Dec 15 Javascript
js input输入百分号保存数据库失败的解决方法
May 26 Javascript
微信小程序网络层封装的实现(promise, 登录锁)
May 08 Javascript
django中使用vue.js的要点总结
Jul 07 Javascript
转换layUI的数据表格中的日期格式方法
Sep 19 #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
You might like
PHP连接SQLServer2005的方法
2015/01/27 PHP
php源码分析之DZX1.5加密解密函数authcode用法
2015/06/17 PHP
php实现贪吃蛇小游戏
2016/07/26 PHP
PHP面向对象程序设计之类与反射API详解
2016/12/02 PHP
PHP中的empty、isset、isnull的区别与使用实例
2019/03/22 PHP
javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
2009/04/07 Javascript
fireworks菜单生成器mm_menu.js在 IE 7.0 显示问题的解决方法
2009/10/20 Javascript
js event事件的传递与冒泡处理
2009/12/06 Javascript
jquery text(),val(),html()方法区别总结
2013/11/04 Javascript
jquery 设置元素相对于另一个元素的top值(实例代码)
2013/11/06 Javascript
jquery实现显示已选用户
2014/07/21 Javascript
JS实现同时搜索百度和必应的方法
2015/01/27 Javascript
AngularJS 实现按需异步加载实例代码
2015/10/18 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
2015/12/03 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
JavaScript对象创建模式实例汇总
2016/10/03 Javascript
jQuery弹出窗口打开链接的实现代码
2016/12/24 Javascript
无法获取隐藏元素宽度和高度的解决方案
2017/03/07 Javascript
bootstrap表单按回车会自动刷新页面的解决办法
2017/03/08 Javascript
vue iView 上传组件之手动上传功能
2018/03/16 Javascript
react使用antd表单赋值,用于修改弹框的操作
2020/10/29 Javascript
Python 文件重命名工具代码
2009/07/26 Python
Python使用functools模块中的partial函数生成偏函数
2016/07/02 Python
Python基于回溯法解决01背包问题实例
2017/12/06 Python
pyQt4实现俄罗斯方块游戏
2018/06/26 Python
利用python实现周期财务统计可视化
2019/08/25 Python
解决PyCharm不在run输出运行结果而不是再Console里输出的问题
2020/09/21 Python
pymongo insert_many 批量插入的实例
2020/12/05 Python
Jupyter Notebook 远程访问配置详解
2021/01/11 Python
如何用border-image实现文字气泡边框的示例代码
2020/01/21 HTML / CSS
英国排名第一的礼品体验公司:Red Letter Days
2018/08/16 全球购物
令人啧啧称赞的经理推荐信
2013/11/07 职场文书
创业计划书中要认真思考的问题
2013/12/28 职场文书
营业员演讲稿
2013/12/30 职场文书
《悯农》教学反思
2014/04/28 职场文书
校园文化艺术节开幕词
2016/03/04 职场文书