vue 使用moment获取当前时间及一月前的时间

 更新时间:2023年08月10日 09:39:05   作者:猪大侠0.0  
开发中会有要获取当前日期的需求,有的是获取到当前月份,本文就介绍了vue获取当前日期时间(moment、new Date()),文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

其实这个没啥,就两行代码,比较容易忘,主要可以用在按时间段查询。

安装 moment

如果之前安装过就不用再安装了。

npm install moment -- save

使用 moment

在使用的文件引用 moment。

import moment from 'moment'

然后在需要使用的地方使用就可以了。

let startDate = moment().subtract(30, "days").format('YYYY-MM-DD')
let endDate =  moment().format('YYYY-MM-DD')

.subtract(30, "days") 的意思是向前推30天,如果是1,就是向前推1天。

YYYY-MM-DD:HH:MM:SS 这个是时分秒的格式化。

//获取当前时间
var now = moment().toDate();//Mon Jul 06 2020 13:50:51 GMT+0800 (中国标准时间)
console.log(now)
//格式化当前时间
now = moment().format('YYYY-MM-DD');//2020-07-06
console.log(now);
//其它几种格式化方法
now = moment().format('L') // 10/22/2016 
console.log(now);
now = moment().format('LL') // October 22, 2016
console.log(now);
//格式化当前时间
now = moment().format('YYYY-MM-DD:HH:MM:SS');
console.log(now);
//获取这个月初时间
let startMonth = moment().startOf('month').toDate();
console.log(startMonth);
//获取今天开始的时间
let dayOfStart = moment().startOf('day').toDate();
console.log(dayOfStart);
//获取今天结束的时间
let dayOfEnd = moment().endOf('day').toDate();
console.log(dayOfEnd);
//获取+n小时
let lateHour = moment().add(2,'hour').toDate();
console.log(lateHour);
//获取+n小时
console.log('//获取-n小时')
let beforeHour = moment().subtract(2,'hour').toDate();
console.log(beforeHour);
//获取+n天
let lateDay = moment().add(+5,'day').toDate();
console.log(lateDay);
//获取-n天
let beforeDay = moment().add(-5,'day').toDate();
console.log(beforeDay);
//也可以表示为
beforeDay = moment().subtract(5,'day').toDate();
console.log(beforeDay);
console.log('//获取+n月')
let lateMonth = moment().add(2,'month').toDate();
console.log(lateHour);
//获取+n月
let beforeMonth = moment().subtract(2,'month').toDate();
console.log(lateHour);
//获取星期
let week = moment().format('dddd');
console.log(week);
//获取到现在的年限 如果不满一年显示出具体几个月
let years = moment('2020-12-31').fromNow();
console.log(years);

到此这篇关于vue 使用moment获取当前时间及一月前的时间的文章就介绍到这了,更多相关vue获取当前日期时间内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vant 中van-list的用法说明

    vant 中van-list的用法说明

    这篇文章主要介绍了vant 中van-list的用法说明,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • vue+koa2搭建mock数据环境的详细教程

    vue+koa2搭建mock数据环境的详细教程

    这篇文章主要介绍了vue+koa2搭建mock数据环境的方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-05-05
  • 纯JS如何实现vue.js下的双向绑定功能

    纯JS如何实现vue.js下的双向绑定功能

    对于vue下的双向绑定功能,个人理解为在处理逻辑的过程中缓存了大量的node对象,node对象可以是html标签、文本内容。既然选择了缓存这些对象,那么在用的过程中哪里需要改变就把node拿出来,进行标签属性的变更或者文本内容的修改。本文主要讲了如何实现双向绑定
    2021-06-06
  • 一文详解vue各种权限控制与管理实现思路

    一文详解vue各种权限控制与管理实现思路

    这篇文章主要为大家介绍了vue各种权限控制与管理的实现思路详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • vue data引入本地图片的两种方式小结

    vue data引入本地图片的两种方式小结

    今天小编就为大家分享一篇vue data引入本地图片的两种方式小结,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • vue前端实现验证码登录功能

    vue前端实现验证码登录功能

    这篇文章主要介绍了vue前端实现验证码登录功能,登录时图形验证通过三种方法结合实例代码给大家讲解的非常详细, 通过实例代码介绍了vue登录时图形验证码功能的实现,感兴趣的朋友一起看看吧
    2023-12-12
  • vuex 动态注册方法 registerModule的实现

    vuex 动态注册方法 registerModule的实现

    这篇文章主要介绍了vuex 动态注册方法 registerModule的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-07-07
  • 前端部署踩坑实战记录(部署后404、页面空白)

    前端部署踩坑实战记录(部署后404、页面空白)

    Vue项目打包部署Nginx服务器后,刷新页面后出现404的问题,下面这篇文章主要给大家介绍了关于前端部署踩坑的实战记录,文中包括部署后404、页面空白等问题的解决办法,需要的朋友可以参考下
    2024-09-09
  • 在vue2.0中引用element-ui组件库的方法

    在vue2.0中引用element-ui组件库的方法

    这篇文章主要介绍了在vue2.0中引用element-ui组件库,需要的朋友可以参考下
    2018-06-06
  • vue3使用vue-i18n的方法详解(ts中使用$t, vue3不用this)

    vue3使用vue-i18n的方法详解(ts中使用$t, vue3不用this)

    所谓的vue-i18n国际化方案就是根据它的规则自己建立一套语言字典,对于每一个字(message)都有一个统一的标识符,下面这篇文章主要给大家介绍了关于vue3使用vue-i18n(ts中使用$t, vue3不用this)的相关资料,需要的朋友可以参考下
    2022-12-12

最新评论