问题描述
在控制台日志中,我有 15:14
,但在模板中,我有 12:14
。为什么?
<template>
<span>{{ date }}</span> <!-- **expected** Thu,25 Feb 2021 15:14:04 Thu,**got** 25 Feb 2021 12:14:04 GMT -->
</template>
<script>
export default {
computed: {
date() {
const date = getStatusDate(); // returns string 2021-02-25 15:14:04
return dayjs(date,'YYYY-MM-DD HH:mm:ss+z')
}
}
}
</script>
解决方法
由于输入日期字符串没有指定时区,Date
中的底层 dayjs
对象假定本地时区。模板的字符串插值leads to dayjs().toString()
,which uses Date.prototype.toUTCString()
,导致显示时间不同。
解决办法是用dayjs().format()
来控制输出字符串的格式:
dayjs(date,'YYYY-MM-DD HH:mm:ss').format('YYYY-MM-DD HH:mm:ss')
const getStatusDate = () => '2021-02-25 15:14:04'
new Vue({
el: '#app',computed: {
date() {
const date = getStatusDate()
return dayjs(date,'YYYY-MM-DD HH:mm:ss').format('YYYY-MM-DD HH:mm:ss')
}
}
})
<script src="https://unpkg.com/vue@2.6.12"></script>
<script src="https://unpkg.com/dayjs@1.8.21/dayjs.min.js"></script>
<div id="app">
<p>{{ date }}</p>
</div>