位置: IT常识 - 正文
vue 时间格式总结及转换(vue设置时间格式)
编辑：rootadmin推荐整理分享vue 时间格式总结及转换(vue设置时间格式)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue 当前时间,vue时间戳转换日期格式,vue时间显示,vue时间显示,vue日期格式,vue时间显示,vue日期格式,vue时间显示,内容如对您有帮助，希望把文章链接给更多的朋友！
vue框架中我们常常用el-date-picker标签来显示和选择时间，那么，常见的时间的格式包含年-月-日（yyyy-MM-dd）、年-月-日 时-分-秒（yyyy-MM-dd HH-mm-ss）、标准时间格式以及时间戳。那么今天我们就来总结一下常用的获取方法和它们之间的转换方法。
一、获取当前时间。
先看效果：
Ⅰ. 格式：年-月-日 时-分-秒（yyyy-MM-dd HH-mm-ss）
<template> <div><h1>vue 时间格式常见应用</h1><h3>获取当前时间（格式：年月日时分秒）：{{time}}</h3></div></template><script>export default {data() {return {time:''}},created() {this.getNowTime();},methods: {getNowTime(){const yy = new Date().getFullYear()const MM = (new Date().getMonth() + 1) < 10 ? '0' + (new Date().getMonth() + 1) : (new Date().getMonth() + 1)const dd = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()const HH = new Date().getHours() < 10 ? '0' + new Date().getHours() : new Date().getHours()const mm = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()const ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()this.time = yy + '-' + MM + '-' + dd + ' ' + HH + ':' + mm + ':' + ss;}}}</script>Ⅱ.格式：标准时间
<template> <div><h1>vue 时间格式常见应用</h1><h3>获取当前标准时间（格式：年月日时分秒）：{{standard_time}}</h3></div></template><script>export default {data() {return {standard_time:''}},created() {this.getGMTtime();},methods: {getGMTtime(){this.standard_time =new Date();}}}</script>
Ⅲ.格式：时间戳
<template> <div><h1>vue 时间格式常见应用</h1><h3>获取当前时间的时间戳：{{current_timestamp}}</h3></div></template><script>export default {data() {return {current_timestamp:''}},created() {this.getnowtimestamp();},methods: {getnowtimestamp(){var date = new Date();this.current_timestamp = Date.parse(date)}}}</script>二、时间格式之间的转换
效果：
Ⅰ.年-月-日 时-分-秒格式转换成标准时间
<template> <h1>时间格式之间的转换</h1><h3>1.年月日时分秒格式转换成标准时间</h3><div style="display: flex;"><h5>假如将"2022-08-17 09:54:48"转换成标准时间格式，则标准格式为：</h5><h4>{{conversion_time}}</h4></div></template><script>export default {data() {return {conversion_time: new Date('2022-08-17 09:54:48')}}}</script>Ⅱ.标准时间转换成年-月-日 时-分-秒格式
<template> <h1>时间格式之间的转换</h1> <h3>2.标准时间转换成年月日时分秒格式</h3> <div style="display: flex;"><h5>假如将"Wed Aug 17 2022 09:54:48 GMT+0800 (中国标准时间)"转换成年月日时分秒格式，则 写为：</h5><h4>{{conversion_time1}}</h4></div></template><script>export default {data() {return {conversion_time1:'',}}, created() {this.gettime();}, methods: {gettime(){var date = new Date('Wed Aug 17 2022 09:54:48 GMT+0800 (中国标准时间)');var y = date.getFullYear();var m = date.getMonth() + 1;m = m < 10 ? ('0' + m) : m;var d = date.getDate();d = d < 10 ? ('0' + d) : d;var h = date.getHours();h = h < 10 ? ('0' + h) : h;var min = date.getMinutes();min = min < 10 ? ('0' + min) : min;var s = date.getSeconds();s = s < 10 ? ('0' + s) : s;this.conversion_time1 = y + '-' + m + '-' + d + ' ' + h + ':' + min + ':' + s;} }}</script>Ⅲ.年-月-日 时-分-秒格式转换成时间戳
<template> <h3>3.年月日时分秒格式转换成时间戳</h3> <div style="display: flex;"> <h5>假如将"2022-08-17 09:54:48"转换成时间戳，则写为：</h5><h4>{{conversion_time2}}</h4></div></template><script>export default {data() {return {conversion_time2:Date.parse('2022-08-17 09:54:48')}}}</script>这时你是不是有点困惑怎么来判断转换的时间戳是否正确呢，我们可以通过在线的转换工具来转换检测，转换工具网址：时间戳(Unix timestamp)转换工具 - 在线工具
那下面我们来检测一下：
所以转换的是没有问题的！
上一篇：不符合Win11硬件标准如何照样升级Win11？(不符合win11硬件要求安装会怎么样)
下一篇：IAM.exe进程能不能删除 有哪些用处(java.exe进程可以关掉吗)
