当前位置: 首页 > news >正文

Vue中如何使用dayjs

Day.js中文网Day.js是一个极简的JavaScript库,可以为现代浏览器解析、验证、操作和显示日期和时间。icon-default.png?t=N7T8https://dayjs.fenxianglu.cn/

单位不区别大小写,支持复数和缩写形式

单位缩写描述

date

D日期 [1,31]
dayd星期 [0,6](星期日0,星期六6)
monthM月份 [0,11] (0表示1月份)
yeary年 [1,31]
hourh小时 [0,23]
minutem分钟 [0,59]
seconds秒 [0,59]
millisecondms毫秒 [0,999]

 把dayjs()对象当成一个中转站,往后所有的关于日期的计算都先转成dayjs()对象,再进行加减等运行。 

一、下载dayjs

cnpm i -S dayjs

二、引入dayjs

如果在node中,引入方式为:let dayjs=require('dayjs')

如果在vue项目中,在main.js中全局引入:

import dayjs from "dayjs"
Vue.prototype.$dayjs = dayjs;

局部引入只需:import dayjs from "dayjs"即可 

dayjs()对象:

即当前时间,dayjs()等价于dayjs(Date.now())、dayjs(new Date())

dayjs()对象格式化: 

格式化dayjs()对象为YYYY-MM-DD HH:mm:ss格式: 

 

 

 从dayjs()对象中获取年月日时分秒:

 代码:

    console.log("dayjs().get('year'):", dayjs().get("year")); //年 [1,366]console.log("dayjs().get('month'):", dayjs().get("month")); //月 [0,11] 0表示1月console.log("dayjs().get('date'):", dayjs().get("date")); //日[1,31]console.log("dayjs().get('hour'):", dayjs().get("hour")); //时 [0,23]console.log("dayjs().get('minute'):", dayjs().get("minute")); //分 [0,59]console.log("dayjs().get('second'):", dayjs().get("second")); //秒 [0,59]console.log("dayjs().get('millisecond'):", dayjs().get("millisecond")); //毫秒[0,999]console.log("dayjs().get('day'):", dayjs().get("day")); //星期几 [0,6]。0(星期日)到6(星期六)

 用单数复数,大写小写,缩写都可以,如year,years,y,Y

dayjs对象-加减指定的时间

    console.log("当前时间:", `${this.$dayjs().format("YYYY-MM-DD hh:mm:ss")}`);console.log("昨天:",`${this.$dayjs().subtract(1, "day").format("YYYY-MM-DD")} 00:00:00`);

dayjs对象-判断2个日期大小 

dayjs对象-判断某个日期是否在2个日期之间 

 此功能需要引入isBetween插件,引入方式如下(Day.js 的 isBetween 方法是 Day.js 库的一部分,因此当你下载和安装 Day.js 时,isBetween会自动包含在其中):

import isBetween from "dayjs/plugin/isBetween";
dayjs.extend(isBetween);

 测试:

console.log("当前时间:", dayjs().format("YYYY-MM-DD"));console.log('2022-1-1 < 当前时间 < 2022-12-31 吗?',  dayjs().isBetween("2022-1-1", dayjs("2022-12-31")));

 dayjs对象-2个日期之间相差多少时、分、秒等

    let time1 = dayjs("2011-7-19 00:00:00");let time2 = dayjs("2011-7-19 01:40:00");console.log("time1:", time1);console.log("time2:", time2);console.log("time1和time2相差多少hour:", time2.diff(time1, "hour"));console.log("time1和time2相差多少minute:", time2.diff(time1, "minute"));console.log("time1和time2相差多少second:", time2.diff(time1, "second"));

各种日期转dayjs对象

普通时间转dayjs

中国标准时间转dayjs 

示例1: 

示例2:

 

示例3:

 

时间戳(ms)转dayjs

时间戳(s)转dayjs 

通过new Date().getTime()获取的时间戳是毫秒级的,为了在某些情况下方便和其他秒级的时间戳比较大小,现需要将毫秒级的转为秒级的,方式如下:

    console.log("new Date():", new Date())console.log("new Date().getTime():", new Date().getTime())console.log("new Date().getTime()/1000:", new Date().getTime() / 1000)console.log("parseInt(new Date().getTime() / 1000):", parseInt(new Date().getTime() / 1000))console.log("Date.parse(new Date())/1000:", Date.parse(new Date()) / 1000)

秒级的时间戳转dayjs必须用dayjs.unix(),如下:

 

相关文章:

Vue中如何使用dayjs

Day.js中文网Day.js是一个极简的JavaScript库&#xff0c;可以为现代浏览器解析、验证、操作和显示日期和时间。https://dayjs.fenxianglu.cn/ 单位不区别大小写&#xff0c;支持复数和缩写形式 单位缩写描述 date D日期 [1,31]dayd星期 [0,6]&#xff08;星期日0&#xff0c…...

数据库-MySQL

建立索引 mysql 添加索引的三种方法 - krt-wanyi - 博客园 (cnblogs.com) 跨库联表查询 MySQL不同数据库不同表连表查询&#xff08;跨库连表查询&#xff09;-CSDN博客 关于微服务跨数据库联合查询的一些解决思路_微服务跨库联表查询-CSDN博客 同一个连接不同数据库前缀 …...

C语言每日一题(61)盛最多水的容器

题目链接 力扣 11 盛最多水的容器 题目描述 给定一个长度为 n 的整数数组 height 。有 n 条垂线&#xff0c;第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。 找出其中的两条线&#xff0c;使得它们与 x 轴共同构成的容器可以容纳最多的水。 返回容器可以储存的最大水…...

uni-app 经验分享,从入门到离职(四)——页面栈以及页面跳转的 API(开发经验总结)

文章目录 &#x1f4cb;前言⏬关于专栏 &#x1f3af;什么是页面栈&#x1f9e9;页面跳转方法&#x1f4cc; uni.navigateTo(OBJECT)&#x1f4cc; uni.redirectTo(OBJECT)&#x1f4cc; uni.reLaunch(OBJECT)&#x1f4cc; uni.switchTab(OBJECT)&#x1f4cc; uni.navigateBa…...

Go Module常用命令

Go Module常用命令TOC Go Module常用命令 go mod init #初始化go.mod go mod tidy #更新依赖文件 go mod download #下载依赖文件 go mod vendor #将依赖转移至本地的vendor文件 go mod edit #手…...

ubuntu压缩和解压

-c 创建 -x 解压 -v 显示过程 -f 文件名 xz格式 tar -tf arm-linux-gnueabi-5.4.0.tar.xz 查看压缩包的内容 tar -xf arm-linux-gnueabi-5.4.0.tar.xz -C / 解压 gz格式 t…...

华为HCIP Datacom H12-831 卷24

多选题 1、如图所示&#xff0c;某园区部署OSPF实现网络互通&#xff0c;其中Area1部署为NSSA区域。某工程师为了实现R1访问R4的环回口地址&#xff0c;在R4的OSPF进程中引入直连路由。以下关于该场景的描述,错误的有哪些项? A、在R4引入直连路由后&#xff0c;R1通过转换后的…...

react + Typescript 中 react有多少内置的类型 分别是什么

react Typescript 中 react有多少内置的类型 分别是什么 React 和 TypeScript 结合使用时&#xff0c;React 提供了一系列的内置类型&#xff08;也称为类型定义或类型别名&#xff09;来帮助你在 TypeScript 中编写类型安全的代码。这些类型定义涵盖了 React 的各个方面&…...

harbor(docker仓库)仓库部署 - 高可用

harbor&#xff08;docker仓库&#xff09;仓库部署 - 高可用 1. harbor高可用1.1 方案说明1. 双主复制2. 多harbor实例共享后端存储 1.2 部署高可用&#xff08;多harbor实例共享后端存储&#xff09;1. 服务器划分2. 安装harbor&#xff08;先部署一套Harbor&#xff0c;用于…...

题目 1262: 邮局选址问题

题目描述: 在一个按照东西和南北方向划分成规整街区的城市里&#xff0c;n个居民点散乱地分布在不同的街区中。用x 坐标表示东西向&#xff0c;用y坐标表示南北向。各居民点的位置可以由坐标(x,y)表示。街区中任意2 点(x1,y1)和(x2,y2)之间的距离可以用数值|x1-x2||y1-y2|度量…...

内核内存回收关键隐藏变量之page引用计数

在分析内核内存回收源码时&#xff0c;page引用计数并不显眼&#xff0c;但是page引用计数对page的内存回收至关重要。本文基于linux-4.18.0-240版本内核源码&#xff0c;总结下文件页page的引用计数的相关细节。首先是get_page()和put_page()函数&#xff0c;分别令page引用计…...

数据结构---链表的基本操作

头插法遍历链表尾插法头删法尾删法按位置插入数据按位置删除数据直接插入排序 链表翻转快慢指针 linklist.c #include <stdio.h> #include <stdlib.h> #include "./linklist.h"linklist* create_linklist(void) {linklist* head (linklist*)malloc(siz…...

异步框架Celery在Django中的运用

参考博客&#xff1a;https://www.cnblogs.com/pyedu/p/12461819.html 参考视频&#xff1a;01 celery的工作机制_哔哩哔哩_bilibili 定义&#xff1a;简单灵活、处理大量消息的分布式系统&#xff0c;专注于实时处理异步队列&#xff0c;支持任务调度 主要架构&#xff1a; …...

YOLOv5代码解读[02] models/yolov5l.yaml文件解析

文章目录 YOLOv5代码解读[02] models/yolov5l.yaml文件解析yolov5l.yaml文件检测头1--->耦合头检测头2--->解耦头检测头3--->ASFF检测头Model类解析parse_model函数 YOLOv5代码解读[02] models/yolov5l.yaml文件解析 yolov5l.yaml文件 # YOLOv5 &#x1f680; by Ult…...

智能搬运机器人|海格里斯将如何持续推进工业和物流的智能化升级与发展?

存取、搬运、分拣是物流行业中的通用功能&#xff0c;但具体到每个行业又十分不同&#xff0c;例如&#xff1a;新能源电池领域&#xff0c;它所搬运的东西是电池&#xff0c;50KG~200KG&#xff1b;快递行业领域&#xff0c;所要处理的物料是那种扁平件和信封等等&#xff0c;…...

linux之前后端项目部署与发布

目录 前言 简介 一、安装Nginx 二、后端部署 2.1多个tomcat负载均衡 2.2 负载均衡 2.3 后端项目部署 三、前端部署 1.解压前端 2.Nginx配置文件修改 3.IP域名映射 4.重启Nginx服务 前言 上篇博主已经讲解过了单机项目的部署linux之JAVA环境配置JDK&Tomcat&a…...

Python 高级语法:一切皆对象

1 “一切皆对象”是一种核心设计哲学 在编程领域&#xff0c;特别是面向对象编程&#xff08;OOP&#xff09;中&#xff0c;“一切皆对象”是一种核心设计哲学。这种哲学主张&#xff0c;无论是数据、函数、还是更复杂的结构&#xff0c;都可以被视为对象&#xff0c;并赋予…...

python jupyter notebook打开页面方便使用

如果没安装jupyter, 请安装&#xff1a; pip install jupyter notebook 运行jupyter notebook jupyter-notebook...

音视频开发之旅(69)-SD图生图

目录 1. 效果展示 2. ControlNet介绍 3. 图生图流程浅析 4. SDWebui图生图代码流程 5. 参考资料 一、效果展示 图生图的应用场景非常多&#xff0c;比较典型的应用场景有风格转化&#xff08;真人与二次元&#xff09;、线稿上色、换装和对图片进行扩图等&#xff0c;下面…...

數據集成平台:datax將hive數據步到mysql(全部列和指定列)

數據集成平台&#xff1a;datax將hive數據步到mysql&#xff08;全部列和指定列&#xff09; 1.py腳本 傳入參數&#xff1a; target_database&#xff1a;數據庫 target_table&#xff1a;表 target_columns&#xff1a;列 target_positions&#xff1a;hive列的下標&#x…...

GME-Qwen2-VL-2B-Instruct代码实例:自定义指令前缀‘Find an image that matches...’注入方法

GME-Qwen2-VL-2B-Instruct代码实例&#xff1a;自定义指令前缀‘Find an image that matches...’注入方法 1. 项目背景与价值 在实际的图文匹配场景中&#xff0c;我们经常需要判断一张图片与多个文本描述之间的匹配程度。GME-Qwen2-VL-2B-Instruct作为一个强大的多模态模型…...

G-Helper终极指南:如何用轻量级工具优化华硕笔记本性能与电池健康

G-Helper终极指南&#xff1a;如何用轻量级工具优化华硕笔记本性能与电池健康 【免费下载链接】g-helper Lightweight, open-source control tool for ASUS laptops and ROG Ally. Manage performance modes, fans, GPU, battery, and RGB lighting across Zephyrus, Flow, TUF…...

Git-RSCLIP入门到精通:从基础地物识别到复杂场景分析全流程解析

Git-RSCLIP入门到精通&#xff1a;从基础地物识别到复杂场景分析全流程解析 1. 遥感智能分析的新利器 在遥感图像分析领域&#xff0c;传统方法往往需要大量标注数据和复杂的模型训练流程。Git-RSCLIP的出现彻底改变了这一局面&#xff0c;它基于先进的SigLIP架构&#xff0c…...

Qwen2.5-7B入门实战:从Docker到网页服务的全流程解析

Qwen2.5-7B入门实战&#xff1a;从Docker到网页服务的全流程解析 1. 引言&#xff1a;为什么选择Qwen2.5-7B Qwen2.5-7B是阿里最新开源的大语言模型&#xff0c;相比前代版本在知识量、编程能力和数学能力上有显著提升。对于想要快速体验大模型能力的开发者来说&#xff0c;通…...

RePKG:突破动态壁纸资源壁垒的开源工具

RePKG&#xff1a;突破动态壁纸资源壁垒的开源工具 【免费下载链接】repkg Wallpaper engine PKG extractor/TEX to image converter 项目地址: https://gitcode.com/gh_mirrors/re/repkg 当你面对一个包含丰富素材的动态壁纸资源包&#xff08;PKG文件&#xff09;却无…...

Qwen3.5-2B图文理解教程:GIF动图逐帧理解+动态内容总结生成方法

Qwen3.5-2B图文理解教程&#xff1a;GIF动图逐帧理解动态内容总结生成方法 1. 引言 Qwen3.5-2B是一款轻量化多模态基础模型&#xff0c;属于Qwen3.5系列的小参数版本&#xff08;20亿参数&#xff09;。这款模型主打低功耗、低门槛部署&#xff0c;特别适配端侧和边缘设备&am…...

计算机毕业设计:Python汽车销售数据可视化与分析系统 Flask框架 requests爬虫 可视化 数据分析 大数据 机器学习 大模型(建议收藏)✅

博主介绍&#xff1a;✌全网粉丝10W,前互联网大厂软件研发、集结硕博英豪成立工作室。专注于计算机相关专业项目实战6年之久&#xff0c;选择我们就是选择放心、选择安心毕业✌ > &#x1f345;想要获取完整文章或者源码&#xff0c;或者代做&#xff0c;拉到文章底部即可与…...

终极英雄联盟工具集:3大核心功能让你轻松掌控游戏全局

终极英雄联盟工具集&#xff1a;3大核心功能让你轻松掌控游戏全局 【免费下载链接】League-Toolkit 兴趣使然的、简单易用的英雄联盟工具集。支持战绩查询、自动秒选等功能。基于 LCU API。 项目地址: https://gitcode.com/gh_mirrors/le/League-Toolkit League-Toolkit…...

【JDK21虚拟线程生产就绪 checklist】:8类典型场景配置模板(WebFlux/Quarkus/Vert.x/RSocket全覆盖)

第一章&#xff1a;JDK21虚拟线程核心机制与生产就绪定义虚拟线程&#xff08;Virtual Threads&#xff09;是 JDK 21 中正式引入的里程碑特性&#xff08;JEP 444&#xff09;&#xff0c;其本质是轻量级、用户态调度的 Java 线程抽象&#xff0c;由 JVM 在平台线程&#xff0…...

国行iPhone Siri功能意外上线又撤回,背后暗藏玄机

iPhone“Siri”变身“Apple智能与Siri”&#xff0c;意外功能短暂亮相3月31日凌晨&#xff0c;部分国行iPhone用户惊喜发现&#xff0c;手机设置中的“Siri”入口悄然变更为“Apple智能与Siri”&#xff0c;同时还短暂解锁了端侧模型下载及AI功能。不过&#xff0c;这一新鲜体验…...