1.VUE組件中這樣寫
2. 過濾器
filters: {
formatDateTime: function(val) {
var value = new Date(val);
var year = value.getFullYear();
var month = padDate(value.getMonth() + 1);
var day = padDate(value.getDate());
return year + "-" + month + "-" + day;
}
},
3.頁面顯示
4.在.vue文件<template>標籤裏,先把變量轉爲date類型,再添加過濾器
5.手機上顯示正常(此情況在電腦端顯示正確,部分手機也顯示正確,本人在8p上顯示NaN,修改後8p顯示正常)
錯錯錯錯錯錯!!!!!!!!!!!!!!!!!!!!!!!!!!
按照以上的寫法,雖然時間是格式化了,在ios上可以正常顯示,但是時間都別格式化未當前時間的年月日,有問題
一下方案可以解決時間格式化在ios上出現NaN
於是想到用moment.js,成功解決問題!!
1.vue中先引入npm install moment --save
import moment from "moment/moment";
2.將時間利用moment轉化爲帶/的格式
//注意:蘋果手機不支持以“-”分割的時間形式,故必須進行格式轉換爲‘YYYY/MM/DD HH:mm:ss‘。 //date格式是後臺返回過來的Timestamp 2018-09-01T09:10:41.000+0000 let transTime = moment(date).format('YYYY/MM/DD HH:mm:ss')
//利用moment工具生成date對象 let date = moment(t).toDate()
3.然後就可以按照你之前的格式化來格式了
dateFormat(fmt, date) {
if (date == null || date == "") {
return "未知";
}
//注意: 蘋果手機不支持以“ - ”分割的時間形式, 故必須進行格式轉換爲‘ YYYY / MM / DD HH: mm: ss‘。
//date格式是後臺返回過來的Timestamp 2018 - 09 - 01 T09: 10: 41.000 + 0000
if (Object.prototype.toString.call(date) !== '[object Date]') {
let transTime = moment(date).format('YYYY/MM/DD HH: mm: ss');
date = moment(transTime).toDate(); // //利用moment工具生成date對象
// date = new Date(date);
}
var o = {
"M+": date.getMonth() + 1, //月份
"d+": date.getDate(), //日
"h+": date.getHours(), //小時
"m+": date.getMinutes(), //分
"s+": date.getSeconds(), //秒
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
"S": date.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt))
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt))
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
},
ok,頁面再真的顯示正常了