js中moment方法_jquery 虚拟dom

js中moment方法_jquery 虚拟domvue项目中,需要把moment.js挂载到全局上(即vue的原型链上),访问时直接使用this.moment();vue项目中不挂载到全局,单文件(单组件)使用:==>>importmomentfrom”moment”;然后直接使用moment()1.初始化日期/时间初始化日期:moment().for…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

vue项目中,需要把 moment.js 挂载到全局上(即vue的原型链上),访问时直接使用 this.moment() ;

vue项目中不挂载到全局,单文件(单组件)使用:

          ==>>  import moment from “moment”;      然后直接使用 moment() 

1. 初始化日期 / 时间

初始化日期:moment().format(‘YYYY-MM-DD’);

初始化日期时间:moment().format(‘YYYY-MM-DD HH:mm:ss’);

2. 格式化日期 / 时间

格式化日期:moment(value).format(‘YYYY-MM-DD’);

格式化日期时间:moment(value).format(‘YYYY-MM-DD HH:mm:ss’);

3. 加/减  ==>>  操作之前必须使用 this.moment(日期变量) ;将要操作的日期转为 moment.js 可以处理的日期时间格式

加法:this.moment().add(1, ‘months’).format(‘YYYY-MM-DD’);    ==>> 当前日期加一个月并输出格式为 ‘YYYY-MM-DD’

加法:this.moment(startDate).add(2, ‘days’).format(‘YYYY-MM-DD’)      ==>> 指定日期(startDate)加2天并输出格式                                                                                                                                       为 ‘YYYY-MM-DD’

减法: this.moment().subtract(7, ‘days’);     ==>> 当前时间减去7天

加法:this.moment(startDate).subtract(2, ‘days’).format(‘YYYY-MM-DD’)      ==>> 指定日期(startDate)加减去2天并输出格式                                                                                                                                       为 ‘YYYY-MM-DD’

4. 获取某年某月的第一天或最后一天

获取某年某月的第一天:startOf(‘month’)、startOf(‘year’)

moment(日期).startOf('month').format("YYYY-MM-DD")//日期可以是 年月的格式 也可以是年月日的格式

moment(日期).startOf('year').format("YYYY-MM-DD")

获取某年某月的最后一天:endOf(‘month’)、endOf(‘year’)

moment(日期).endOf('month').format("YYYY-MM-DD")//日期可以是 年月的格式 也可以是年月日的格式

moment(日期).endOf('year').format("YYYY-MM-DD")

5. 获取星期几

获取星期几: this.moment().day()  或  this.moment(startDate).day()      ==>> 当前日期/指定日期 是星期几(星期日为 0、星期六为 6

6. 获取毫秒数

获取毫秒数:this.moment().valueOf()  或  this.moment(startDate).valueOf()   

                     ==>> 在获取指定时间的毫秒数时,必须要有日期。即startDate包括日期时间

7. 获取时间差(以毫秒计算)

两个日期/时间的时差:this.moment(endTime).diff(this.moment(startTime),’days’ )

                                     ==>>  开始时间和结束时间的时间差,以“天”为单位;endTime和startTime都是毫秒数

                                    this.moment(endTime).diff(this.moment(startTime), ‘minutes’)

                                     ==>>  开始时间和结束时间的时间差,以“分钟”为单位

                    ==>> 注意:计算时间差时,可以以 “years”、“days”、“hours”、“minutes” 以及 “seconds” 为单位输出!

8. 两个具体的日期之差(天数,也可以是年)

js中moment方法_jquery 虚拟dom

9. 获取时、分、秒

原理:利用字符串的 split 方法拆分时分秒,然后分别用moment的 hour、minute 和 second 方法;带有日期的可以用 .valueof() 方法。

const fixStart = '08:00:00'

const getHour = this.moment().hour(Number(fixStart.split(':')[0]));
const getMinute = this.moment().minute(Number(fixStart.split(':')[1]));
const getSecond = this.moment().second(Number(fixStart.split(':')[2]));
            
// 描述为0,直接写出second(0)
const getHour_Minute_Second = this.moment().hour(Number(fixStart.split(':')[0])).minute(Number(fixStart.split(':')[1])).second(0);       

console.log('=====输出',getHour,getMinute,getSecond,getHour_Minute_Second);

得到的结果都是moment.js 自身的时间格式。可以用 format 转换为自己想要的格式,也可以用 diff 方法做时间差的计算

js中moment方法_jquery 虚拟dom

10. 将毫秒数转为时分秒

注意:毫秒转为其他单位时,达到你想要转的单位时,为1,超过时不管,不足时为0;

           如4800000(80分钟),转为天:0

                                                   转为小时:1

                                                   转为分钟:20

                                                   转为秒:0

const msTime = 4800000;        //80分钟

moment.duration(msTime).hours();       //转为小时,值为1
moment.duration(msTime).minutes();     //转为分钟,值为20
moment.duration(msTime).seconds();     //转为秒,值为0

转为其他单位:

moment.duration(msTime, 'seconds');        //转为秒
moment.duration(msTime, 'minutes');        //转为分
moment.duration(msTime, 'hours');          //转为小时
moment.duration(msTime, 'days');           //转为天
moment.duration(msTime, 'weeks');          //转为周
moment.duration(msTime, 'months');         //转为月
moment.duration(msTime, 'years');          //转为年

对应的显示格式:

js中moment方法_jquery 虚拟dom

11. 判断一个日期是否在两个日期之间  isBetween

语法: this.moment().isBetween(moment-like, moment-like, String, String);

a. 不包含起始这两个日期(只有两个参数)   ==>> 中文网只有两个参数

this.moment('2010-10-20').isBetween('2010-10-19', '2010-10-25'); // true
this.moment('2010-10-19').isBetween('2010-10-19', '2010-10-25'); // false
this.moment('2010-10-25').isBetween('2010-10-19', '2010-10-25'); // false

b. 自定义是否包含起始日期(四个参数,主要是第四个参数)   ==>> 英文网才有四个参数

        第三个参数,固定为null;

        第四个参数,字符串,( ) 表示不包含,[ ] 表示包含。右括号制开始日期,右括号控制结束日期

this.moment('2016-10-30').isBetween('2016-10-30', '2016-12-30', null, '()'); //false
this.moment('2016-10-30').isBetween('2016-10-30', '2016-12-30', null, '[)'); //true
this.moment('2016-10-30').isBetween('2016-01-01', '2016-10-30', null, '()'); //false
this.moment('2016-10-30').isBetween('2016-01-01', '2016-10-30', null, '(]'); //true
this.moment('2016-10-30').isBetween('2016-10-30', '2016-10-30', null, '[]'); //true

12. 判断一个日期是否在另外一个日期 前 isBefore

语法: this.moment( end ).isBefore( start )  moment文档

a. 默认比较日期

注意:两个日期相同是,结果也是 false

moment('2022-04-20').isBefore('2022-04-25');  // true  => 第一个日期在第二个日期前
moment('2022-04-28').isBefore('2022-04-25');  // false => 第一个日期不在第二个日期前
moment('2022-04-25').isBefore('2022-04-25');  // false => 两个日期相同

b. 第二个参数用于确定精度,因此可以指定检查年份、月份、日期

moment('2010-10-20').isBefore('2010-12-31', 'year'); // false
moment('2010-10-20').isBefore('2011-01-01', 'year'); // true

文章仅为本人学习过程的一个记录,仅供参考,如有问题,欢迎指出!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/196862.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • springboot 整合 Mybatis、JPA、Redis「建议收藏」

    springboot 整合 Mybatis、JPA、Redis「建议收藏」引言在springboot项目中,我们是用ORM框架来操作数据库变的非常方便。下面我们分别整合mysql,springdatajpa以及redis。让我们感受下快车道。我们首先创建一个springboot项目,创建好之后,我们来一步步的实践。使用mybatis引入依赖:<dependency><groupId>org.mybatis.spring.boot</groupId><artifactId>mybatis

    2022年10月20日
  • reentrantlock_lock condition

    reentrantlock_lock conditionReentrantLock锁的底层实现已经阐述过了,那么如何使用,本文进行下样例展示,主要说两个功能:1.lock及中断,2.申请等待时间;lock锁/***@Description:*@author:Erick*@version:1.0*@time:2018-9-25*/publicclassReentrantLockThreadimple…

    2022年10月11日
  • SVN使用 IDEA集成SVN SVN简介 SVN使用详解 SVN学习之路

    SVN使用 IDEA集成SVN SVN简介 SVN使用详解 SVN学习之路文章目录SVN介绍与使用一、SVN引入1.SVM服务器搭建2.需要了解的关键词3.如何让系统共享信息,并且不互相干扰。4.SVN架构二、SVN的操作1.安装tortoisesSvn2.初始化拉去仓库3.提交4.拉取服务器上最新版本5.解决冲突三、Idea集成SVN3.1配置3.2关联服务器仓库SVN介绍与使用一、SVN引入SVN==Subversion它是一个自由/开源的集中式版本控制系统,一组文件存放在中心版本库,记录每一次文件和目录的修改,Subversion允许把数据

    2022年10月11日
  • c++与三菱plc通信_C语言编写的代码是

    c++与三菱plc通信_C语言编写的代码是FX系列作为三菱基本款的PLC,它们之间的通讯体例别离如下:CC-LINK,N:N网络连接,并联连接。1.CC-LINK连接CC-LINK连接图如下:三菱PLC通讯与编程实例!-1.jpg(21.71KB,下载次数:0)2018-6-103:01上传对应的PLC可为FX1N、FX1NC、FX2N、FX2NC、FX3U、FX3UC,因为在使用CC-LINK通讯时要扩展CC-LINK模块,…

  • Ubuntu 更换国内源[通俗易懂]

    Ubuntu 更换国内源[通俗易懂]Ubuntu系统自带的源都是国外的网址,国内用户在使用的时候网速比较慢。一个软件的下载是十分痛苦的,这里讲解一下如何将国外源更换为国内源,让你的网速Biu.Biu.Biu1.备份原来的源sudocp/etc/apt/sources.list/etc/apt/sources_init.list将以前的源备份一下,以防以后可以用的。2.更换源sudogedi…

  • 获取32位模块_uuid多少位

    获取32位模块_uuid多少位UUID.randomUUID().toString().replace("-","");

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号