900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > Vue.js中将时间戳转换为日期格式

Vue.js中将时间戳转换为日期格式

时间:2019-04-30 10:19:30

相关推荐

Vue.js中将时间戳转换为日期格式

什么是时间戳

Unix时间戳(Unix timestamp),或称Unix时间(Unix time)、POSIX时间(POSIX time),是一种时间表示方式,定义为从格林威治时间1970年01月01日00时00分00秒起至现在的总秒数。

问题描述

在Vue项目中从后台请求过来的数据是一个对象数组,

对象中的create_time属性为时间戳表示的创建时间,

在前端的展示,需要用正常的 年-月-日 时-分-秒 这种格式,

例如 1512535620 转换为 1970-01-18 20:08:55。

解决代码

核心js代码

function add0(m){return m<10?'0'+m:m }function format(shijianchuo){//shijianchuo是整数,否则要parseInt转换var time = new Date(shijianchuo);var y = time.getFullYear();var m = time.getMonth()+1;var d = time.getDate();var h = time.getHours();var mm = time.getMinutes();var s = time.getSeconds();return y+'-'+add0(m)+'-'+add0(d)+' '+add0(h)+':'+add0(mm)+':'+add0(s);}

在Vue项目中的使用

首先在methods中加入add和format这两个方法

注:其中format方法在方法内部调用了add方法

methods:{// 转换时间戳为日期格式方法add(m) {return m < 10 ? "0" + m : m;},format(shijianchuo) {//shijianchuo是整数,否则要parseInt转换var time = new Date(shijianchuo);var y = time.getFullYear();var m = time.getMonth() + 1;var d = time.getDate();var h = time.getHours();var mm = time.getMinutes();var s = time.getSeconds();return (y +"-" +this.add(m) +"-" +this.add(d) +" " +this.add(h) +":" +this.add(mm) +":" +this.add(s));},}

然后,在获取数据之后,用for循环遍历数组中的每一个对象,

调用format方法,将每一个对象的时间戳转换为日期格式。

methods:{getOrderList() {this.$http.get("orders", {params: this.queryInfo,}).then((res) => {console.log(res);var temp = res.data.data.goods;// 将时间戳转换为日期格式for (var i = 0; i < temp.length; i++) {temp[i].create_time = this.format(temp[i].create_time);}this.orderList = temp;this.total = res.data.data.total;});},}

完活,成品展示

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。