原生JS 日期格式化 (形如yyyMMdd hh:mm:ss等)

代码

function formatDate(date, fmt) {
  var currentDate = new Date(date);
  var o = {
    "M+": currentDate.getMonth() + 1, //月份
    "d+": currentDate.getDate(), //日
    "h+": currentDate.getHours(), //小时
    "m+": currentDate.getMinutes(), //分
    "s+": currentDate.getSeconds(), //秒
    "q+": Math.floor((currentDate.getMonth() + 3) / 3), //季度
    "S": currentDate.getMilliseconds() //毫秒
  };
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (currentDate.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;
}

用法

格式可任意组合

formatDate(date, "yyyyMMdd hh:mm:ss")

在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以使用Vue.js的生命周期钩子函数和原生JavaScript来实现实时显示当前时间并格式化输出。 首先,在Vue组件中,你可以使用data选项来定义一个变量来保存当前时间,例如: ``` <template> <div> {{ currentTime }} </div> </template> <script> export default { data() { return { currentTime: '' } }, mounted() { setInterval(() => { this.currentTime = this.formatDate(new Date()) }, 1000) }, methods: { formatDate(date) { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const hours = date.getHours() const minutes = date.getMinutes() const seconds = date.getSeconds() return `${year}-${this.padZero(month)}-${this.padZero(day)} ${this.padZero(hours)}:${this.padZero(minutes)}:${this.padZero(seconds)}` }, padZero(num) { return num < 10 ? `0${num}` : num } } } </script> ``` 在上面的代码中,我们定义了一个名为currentTime的变量,然后在mounted生命周期钩子函数中使用setInterval函数每秒更新一次该变量的值。我们还定义了一个名为formatDate的方法来格式化日期,该方法接收一个Date对象作为参数,并返回格式化后的字符串。该方法使用了ES6模板字符串和JavaScriptDate对象的方法来获取年月日时分秒。我们还定义了一个名为padZero的方法来将单数的数字前面补零。 最后,在模板中,我们使用双括号绑定语法来显示currentTime变量的值。 当组件被挂载时,setInterval函数会每秒执行一次回调函数,更新currentTime变量的值。每次更新时,Vue.js会自动更新模板中双括号绑定的值,从而实现实时显示当前时间的效果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值