moment.js时间格式化插件使用

news2024/9/9 3:58:48

moment.js插件常用api备忘

moment.js插件功能远不不仅仅是在格式化日期上,还是有很多很好用奇淫技巧,使用起来也是更加方便,主要在vue项目中使用偏多,,但是有时候也不是总使用,将一些项目中可能会用,可以节省代码的api在此记录备忘一下


文章目录

  • moment.js插件常用api备忘
    • 1、引入
        • 1.1 安装
        • 1.2 基本使用
        • 1.3 说明
            • 1.3.1 【 大小写】
    • 2、场景使用api
      • 2.1 近七日、近6个月场景
      • 2.2 其他api罗列示例
            • 2.2.1 根据时间戳格式化时间:
            • 2.2.2 格式化日期为数组格式:
            • 2.2.3 获取年月日时分秒单个值:


1、引入

官网地址:Moment.js

1.1 安装
npm install moment --save 

使用的组件文件中导入

import moment from 'moment'

格式化使用的默认语言格式使用中文
就在导入插件的位置再导入一行:moment.locale(‘zh-cn’)即可

import moment from 'moment'
moment.locale('zh-cn')

或者

import moment from 'moment'
moment.lang('zh-cn'
1.2 基本使用

当前日期格式化

moment().format('YYYY-MM-DD HH:mm:ss')

输出:
2024-07-30 13:30:16

1.3 说明

日期格式化中,字母代表

  • y : (year)年
  • m:(month)月
  • d :(day)日
  • h :(hour)时
  • m:(minute)分
  • s : (second)秒
1.3.1 【 大小写】

大写是位数确定,不够的使用0来进行补位,以年示例:

console.log('时间格式化:', moment('1970').format('YY'))

时间格式化: 70

console.log('时间格式化:', moment('1').format('YY'))

时间格式化: 01

其中一个"Y"表示自然生长,首位不为零,但是超过9999时,会多一个+号,主要是符合ios标准,即:
1970 1971 … 9999 +10001 10001
所以大写的位数可以很多种:Y , YY , YYYY , YYYYYY
常用格式:YYYY
小写只有一种写法:‘y’,用法基本与Y相同,只有超过9999的时候,y是正常显示,没有+号

console.log('时间格式化:', moment('10001').format('y'))

时间格式化: 10001

常用格式罗列说明:

【第一种】

moment().format('YYYY年MM月DD日 HH:mm:ss')

时间格式化: 2024年07月30日 13:57:39

【第二种】

moment().format('YYYY-MM-DD HH:mm:ss')

时间格式化: 2024-07-30 13:57:57

【第三种】

moment().format('YYYY/MM/DD HH:mm:ss')

时间格式化: 2024/07/30 13:58:26

项目中主要使用elementUI的时间日期选择插件,所以第二种的方式用的比较多

2、场景使用api

按照业务需求角度来记录api

2.1 近七日、近6个月场景

【业务描述】:页面场景中一些列表查询、图表展示需要一些时间快捷选项,比如,近七日、近六个月、近三年等等,
在这里插入图片描述
【实现分析】:这个接口传参时间上肯定分两部分,开始时间、结束时间。
结束时间:当前时间,
开始时间: 当前时间 - 7*24小时

【moment插件快捷语法】:
关键词:subtract(减)
七天前的时间:

moment().subtract(7, 'days').format('YYYY-MM-DD HH:mm:ss')

时间格式化: 2024-07-23 14:17:37(当前7-30)

================

同样,加的方法:add

 moment().add(7, 'days').format('YYYY-MM-DD HH:mm:ss')

时间格式化: 2024-08-06 14:23:02

【语法说明】
invalid.subtract(value, unit),
第一个参数是数值
第二个参数是单位:全称:简写
years y
months M
weeks w
days d
hours h
minutes m
seconds s
milliseconds ms
也可以多个参数,使用对象的方式:

 moment().subtract({hours: 23, minutes: 59, seconds: 59})

当前时间减去23小时59分59秒,
add语法同理

2.2 其他api罗列示例

2.2.1 根据时间戳格式化时间:
moment(1318781876406).format('YYYY-MM-DD HH:mm:ss')

时间格式化: 2011-10-17 00:17:56

2.2.2 格式化日期为数组格式:
moment([2010, 1, 14, 15, 25, 50]).format('YYYY-MM-DD HH:mm:ss')

时间格式化: 2010-02-14 15:25:50

2.2.3 获取年月日时分秒单个值:
moment().year()
moment().month()
moment().date()//日
moment().hour()
moment().minute()
moment().second()
moment().day()//星期几
moment().dayOfYear()//目前一年中的地多少天
moment().quarter()//现在过了几刻钟

相对应(年月日时分秒)的get方法:

moment().get('year');
moment().get('month');  // 0 to 11
moment().get('date');
moment().get('hour');
moment().get('minute');
moment().get('second');

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1960742.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

国内民营企业「数字化转型」典型案例

一、企业简介 三一集团成立于1989年,现有3家上市公司(三一重工、三一国际、三一重能),公司总资产超2000亿元,在国内12个省市设有生产基地,在海外建有印度、美国、德国、巴西四大研发制造基地,业…

【国产化信创平台】麒麟银河V10系统虚拟机创建

目录 一、麒麟V10系统镜像下载 二、虚拟机创建流程 三、麒麟银河系统安装流程 一、麒麟V10系统镜像下载 https://www.kylinos.cn/# 官方访问还是会有问题,如果有需要麒麟银河Kylin系统V10的镜像文件,可以留下邮箱或者私信博主获取。 二、虚拟机创…

【LeetCode】16. 最接近的三数之和

三数之和这道题被反复考到,但是我一次都没给写出来,真是汗颜!本题是三数之和的一道变形题,也是一道好题!本题有两个关键点:其一,双指针是怎么个用法?在本题中是怎么实现的&#xff1…

智慧的拼图:聚类分析的启示

文章目录 聚类分析简介K-means聚类什么是K-means聚类?K-means聚类的步骤K-means聚类的特点K-means聚类实例 层次聚类什么是层次聚类?层次聚类的类型层次聚类的步骤层次聚类的特点层次聚类实例 K-means与层次聚类对比相同点不同点 结论补充 聚类分析是数据…

【永洪BI】1.添加数据源

目录 一、添加文本数据源(EXCEL&TEXT) 二、添加Mysql数据源 一、添加文本数据源(EXCEL&TEXT) 略 二、添加Mysql数据源 1.添加Mysql驱动 2.问题: 问题① 原因: Jar文件上传校验,只允…

类静态方法将python 中把不同脚本融合为一个大脚本 互不影响的方法!首发 以便于维护和扩展。

一般遇见想要方便管理或者集合的大脚本 我们管理很麻烦 用这个方法 无论是什么方面的脚本 都能放在一个大脚本中运行 互不干扰。 将所有功能整合到一个单一的脚本中,而不再依赖外部的.py文件,你可以将rendering.py和sercurity.py中的函数代码直接复制到…

centos7 安装minio

文章目录 下载 Minio 二进制文件配置 Minio将Minio设置成服务 配置Systemd服务启动创建minio变量文件:/etc/default/minio创建Service File:/etc/systemd/system/minio.service设置开启自启动 Nginx反向代理nginx配置 下载 Minio 二进制文件 cd /usr/lo…

VLM系列文章6-Cambrian-1

以视觉为中心的多模态大模型Cambrian-1,主要考虑的是MLLM中视觉模型的影响。 1、评估 LLM 还是 MLLM?:我们在使用 23 种不同的视觉主干训练的 MLLM 中比较了视觉禁用和视觉启用设置之间的性能。我们的研究结果表明,MMMU 和 AI2D 等…

有没有视频ai换脸的软件?

AI视频生成:小说文案智能分镜智能识别角色和场景批量Ai绘图自动配音添加音乐一键合成视频百万播放量https://aitools.jurilu.com/ 发现大家对AI换脸都非常感兴趣,AI换脸一般的步骤是:上传自己的照片→选择不同的风格→制作出被替换的GIF图或视…

安卓修改logo与开机动画后不显示问题解决

问题描述 替换安卓logo与开机动画bootanimation.zip画面是花的或黑的 修复步骤 手动替换安卓framework中的开机logo后显示异常排查 在电脑上打开logo图片, 查看分辨率, 再adb shell wm size查看设备的分辨率,要求二者一致.电脑上右键点击logo图片,查看属性,要确保它的位深度…

数据结构与算法 - 二分查找

一、二分查找 二分查找算法也称折半查找,是一种非常高效的工作于有序数组的查找算法。 时间复杂度 最坏情况:O(log n)最好情况:如果待查找元素恰好在数组中央,只需要循环一次O(1) 空间复杂度 递归->O(log n)&a…

暑期C++ printf和scanf的平替

有任何不懂的问题可以评论区留言&#xff0c;能力范围内都会一一回答 C中也有专门的输入和输出的方法 首先我们需要一个头文件&#xff0c;也就是#include<iostream> 然后根据我们命名空间的知识可知这个地方如果我们要使用必须先展开 可以全部展开比如using namespa…

K8s大模型算力调度策略的深度解析

随着大数据和人工智能技术的飞速发展&#xff0c;Kubernetes&#xff08;简称K8s&#xff09;作为容器编排的领军者&#xff0c;在支撑大规模模型训练和推理方面扮演着越来越重要的角色。在大模型算力的调度过程中&#xff0c;如何高效、合理地分配和管理资源成为了一个亟待解决…

实验2-5-1 求排列数

本题要求实现一个计算阶乘的简单函数&#xff0c;使得可以利用该函数&#xff0c;根据公式 算出从n个不同元素中取出m个元素&#xff08;0<m≤n&#xff09;的排列数。 函数接口定义&#xff1a; double fact( int n );其中n是用户传入的参数&#xff0c;函数返回n的阶乘。…

数据分析概要【数据分析---偏企业】

各位大佬好 &#xff0c;这里是阿川的博客&#xff0c;祝您变得更强 个人主页&#xff1a;在线OJ的阿川 大佬的支持和鼓励&#xff0c;将是我成长路上最大的动力 阿川水平有限&#xff0c;如有错误&#xff0c;欢迎大佬指正 数据分析概要前 必看 Python 初阶 Python–语言基础…

[数据集][目标检测]易拉罐底部缺陷检测数据集VOC+YOLO格式1122张5类别

数据集格式&#xff1a;Pascal VOC格式YOLO格式(不包含分割路径的txt文件&#xff0c;仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数)&#xff1a;1122 标注数量(xml文件个数)&#xff1a;1122 标注数量(txt文件个数)&#xff1a;1122 标注…

企业获客重要途径-大数据获客系统

企业获客的重要途径之一是通过大数据获客系统。这一系统利用大数据技术和分析方法&#xff0c;帮助企业更精准地获取客户&#xff0c;提高市场营销的效率和效果。 所以整理了以下是大数据获客系统作为企业获客重要途径的详细阐述&#xff1a; 一、大数据获客系统的定义与功能…

永磁同步电机谐波抑制算法(8)——基于自适应带宽扩张状态观测器的采样电流偏置误差补偿办法

1.前言 在上一期内容中&#xff0c;已经介绍了采样电流的偏置误差the current measurement offset error /CMOE&#xff08;这个采样电流偏置误差通常认为是直流DC偏置&#xff0c;所以其在dq电流中会造成一次谐波&#xff09;。如果没看过上一期内容&#xff0c;那先需要补一…

SSRF-labs-master靶场

目录 file_get_content.php sql_connect.php download.php dns-spoofing.php dns_rebinding.php 访问链接 http://127.0.0.1/SSRF/# file_get_content.php 在编程语言中&#xff0c;有一些函数可以获取本地保存文件的内容。这些功能可能能够从远程URL以及本地文件 如果没…

C++第二十九弹---C++继承机制深度剖析(上)

✨个人主页&#xff1a; 熬夜学编程的小林 &#x1f497;系列专栏&#xff1a; 【C语言详解】 【数据结构详解】【C详解】 目录 1.继承的概念及定义 1.1继承的概念 1.2 继承定义 1.2.1定义格式 1.2.2继承关系和访问限定符 1.2.3继承基类成员访问方式的变化 2.基类和派生…