1.將時(shí)間戳轉(zhuǎn)換為'YYYY-MM-DD HH:mm:ss'格式-老方法
通過對應(yīng)的年月日時(shí)分秒依次進(jìn)行拼接，另外還需要對小于10的值進(jìn)行處理，在前面添加字符串‘0’，轉(zhuǎn)換為常見的兩位數(shù)時(shí)間格式
function transformTime(timestamp = +new Date()) {
? ? if (timestamp) {
? ? ? ? var time = new Date(timestamp);
? ? ? ? var y = time.getFullYear();
? ? ? ? var M = time.getMonth() + 1;
? ? ? ? var d = time.getDate();
? ? ? ? var h = time.getHours();
? ? ? ? var m = time.getMinutes();
? ? ? ? var s = time.getSeconds();
? ? ? ? return y + '-' + addZero(M) + '-' + addZero(d) + ' ' + addZero(h) + ':' + addZero(m) + ':' + addZero(s);
? ? ? } else {
? ? ? ? ? return '';
? ? ? }
}
function addZero(m) {
? ? return m < 10 ? '0' + m : m;
}
transformTime(); // "2023-01-25?15:25:28"
老方法優(yōu)化思路：
new Date().toJSON獲取的是格林威治時(shí)間的JSON字符串，例如：'2023-01-25T15:39:11.803Z'
轉(zhuǎn)化為北京時(shí)間需要額外增加八個(gè)時(shí)區(qū)，也就是在當(dāng)前時(shí)間戳的基礎(chǔ)上增加8個(gè)小時(shí)
我們需要的是字符串前19位，再把‘T’替換為空格，就是我們需要的時(shí)間格式
function time(time = +new Date()) {
? var date = new Date(time + 8 * 3600 * 1000) // 增加8小時(shí)
? return date
? ? .toJSON()
? ? .substr(0, 19)
? ? .replace('T', '? ')
}
time() //?'2023-01-25 15:39:11'
2.vue中時(shí)間轉(zhuǎn)換插件：moment.js
(1)下載安裝包
npm install moment --save
（2）在main.js中引入
import moment from 'moment'
Vue.prototype.$moment = moment
（3）使用
moment('需要轉(zhuǎn)換的時(shí)間').format('目標(biāo)轉(zhuǎn)換格式');?
this.$moment('需要轉(zhuǎn)換的時(shí)間').format('YYYY-MM-DD')?
更多時(shí)間轉(zhuǎn)換格式，詳細(xì)可見官網(wǎng)：Moment.js 中文網(wǎng)
?
?3.vue?動(dòng)態(tài)顯示實(shí)時(shí)時(shí)間/時(shí)間格式化插件：dayjs
(1)下載安裝包
npm install dayjs --save
（2）在main.js中引入，全局使用
import dayjs from "dayjs"
Vue.prototype.dayjs = dayjs;?
（3）具體使用
this.dayjs().format('YYYY-MM-DD') ?// 當(dāng)前日期：年月日
this.dayjs().format("YYYY-MM-DD HH:mm:ss") ?// 當(dāng)前日期：年月日 時(shí)分秒
/* 獲取過去七天時(shí)間 */
?for (let i = 6; i >= 0; i--) {
? ?let date = this.dayjs(this.dayjs()-24*60*60*1000*i).format("YYYY-MM-DD")
? ?console.log(date)
?}
?dayjs實(shí)現(xiàn)鐘表效果-實(shí)時(shí)顯示時(shí)間
<template>
? <div id="app">
? ? {{this.datetime}}
? </div>
</template>
<script>
? export default {
? ? name: "app",
? ? data() {
? ? ? return {
? ? ? ? timer: '',
? ? ? ? datetime: ''
? ? ? }
? ? },
? ? mounted() {
? ? ? /* 每秒定時(shí)刷新 */
? ? ? this.timer = setInterval(() => {
? ? ? ? this.datetime = this.dayjs().format("YYYY-MM-DD HH:mm:ss")
? ? ? ? console.log(this.datetime)
? ? ? }, 1000)
? ? },
? ? beforeDestroy() {
? ? ? /* 離開頁面前銷毀定時(shí)器 */
? ? ? if(this.timer){
? ? ? ? clearInterval(this.timer);
? ? ? }
? ? }
? };
</script>
?文章來源：http://www.zghlxwxcb.cn/news/detail-780406.html
4.將Excel日期時(shí)間上傳后轉(zhuǎn)成標(biāo)準(zhǔn)時(shí)間?
function formatExcelDate(numb, format = '/') {
? const time = new Date((numb - 25567) * 24 * 3600000 - 5 * 60 * 1000 - 43 * 1000 - 24 * 3600000 - 8 * 3600000)
? time.setYear(time.getFullYear())
? const year = time.getFullYear() + ''
? const month = time.getMonth() + 1 + ''
? const date = time.getDate() + ''
? if (format && format.length === 1) {
? ? return year + format + month + format + date
? }
? return year + (month < 10 ? '0' + month : month) + (date < 10 ? '0' + date : date)
}文章來源地址http://www.zghlxwxcb.cn/news/detail-780406.html
到了這里，關(guān)于前端常見的時(shí)間轉(zhuǎn)換方法合集+動(dòng)態(tài)時(shí)鐘效果實(shí)現(xiàn)的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
