vue获取当前日期时间(moment、new Date())

本文介绍了在Vue项目中如何使用两种方式获取当前日期时间,包括利用原生JavaScript的Date对象进行格式化处理以及通过第三方库moment.js简化操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

vue获取当前日期时间

开发中会有要获取当前日期的需求,有的是获取到当前月份,有的是精确到分秒。

而且日期的格式还不一样,一下有两种获取时间的方式:

1 new Date()+拼接

  • 格式一:
    ​ yy/MM/dd hh:mm:ss – 例如:2022/05/01 00:00:00
    yy/M/d hh:mm:ss – 例如:2022/5/1 00:00:00
/**
* 获取当前时间
*/
currentTime() {
    var date = new Date();
    var year = date.getFullYear(); //月份从0~11,所以加一
    let month = date.getMonth();
    console.log("month",month);
    var dateArr = [
        date.getMonth() + 1,
        date.getDate(),
        date.getHours(),
        date.getMinutes(),
        date.getSeconds(),
    ];
    //如果格式是MM则需要此步骤,如果是M格式则此循环注释掉
    for (var i = 0; i < dateArr.length; i++) {
        if (dateArr[i] >= 1 && dateArr[i] <= 9) {
            dateArr[i] = "0" + dateArr[i];
        }
    }
    var strDate =
        year +
        "/" +
        dateArr[0] +
        "/" +
        dateArr[1] +
        " " +
        dateArr[2] +
        ":" +
        dateArr[3] +
        ":" +
        dateArr[4];
        //此处可以拿外部的变量接收,也可直接返回  strDate:2022-05-01 13:25:30
       	//this.date = strDate;
    console.log("strDate",strDate);
},
  • 格式二:
    yy-MM-dd hh:mm:ss – 例如:2022-05-01 00:00:00
    yy-MM-dd hh:mm:ss – 例如:2022-05-01 00:00:00
    在这里插入图片描述
/**
* 获取当前时间
*/
currentTime() {
    var date = new Date();
    var year = date.getFullYear(); //月份从0~11,所以加一
    let month = date.getMonth();
    console.log("month",month);
    var dateArr = [
        date.getMonth() + 1,
        date.getDate(),
        date.getHours(),
        date.getMinutes(),
        date.getSeconds(),
    ];
    //如果格式是MM则需要此步骤,如果是M格式则此循环注释掉
    for (var i = 0; i < dateArr.length; i++) {
        if (dateArr[i] >= 1 && dateArr[i] <= 9) {
            dateArr[i] = "0" + dateArr[i];
        }
    }
    var strDate =
        year +
        "/" +
        dateArr[0] +
        "/" +
        dateArr[1] +
        " " +
        dateArr[2] +
        ":" +
        dateArr[3] +
        ":" +
        dateArr[4];
        //此处可以拿外部的变量接收  strDate:2022-05-01 13:25:30
       	//this.date = strDate;
    console.log("strDate",strDate);
},
  • 获取当前月份
    在这里插入图片描述
/**
* 获取当前月份,可直接返回
*/
currentTime() {
    var date = new Date();
    var year = date.getFullYear(); //月份从0~11,所以加一
    let month = date.getMonth() + 1;
    console.log("month", month);

    //如果格式是MM则需要此步骤,如果是M格式则此处注释掉
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    let strDate = year + "-" + month;
    return strDate;
},

2 moment()函数获取

  • 下载moment依赖
    npm i moment
    
  • 在所需要的页面引入
    import moment from "moment"
    
    为了方便也可以在全局引入
  • 用法
    this.$moment().format('YYYY-MM-DD HH:mm:ss')
    

此函数很方便,只需在format设置自己需要的格式即可,效果如下
在这里插入图片描述

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

猪大侠0.0

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值