当前位置: 首页 > 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…...

监听bean在容器中注入情况

直接上代码&#xff0c;原理就是 通过环境监听器/*** 调试监听器* author shadow*/ public class DebugListener {Autowiredprivate ApplicationContext applicationContext;EventListener(ApplicationReadyEvent.class)public void onApplicationReady() {System.out.println(…...

仅限本周开放|DeepSeek Chat V3.2功能测试黄金 checklist(含17个边界Case+响应时延基线数据)

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;DeepSeek Chat V3.2功能测试黄金 checklist 发布说明 DeepSeek Chat V3.2 已正式面向开发者开放灰度测试&#xff0c;本次版本聚焦多模态理解增强、长上下文稳定性优化及企业级安全策略集成。为保障测试…...

AI技能工程框架解析:从模块化设计到智能体构建实战

1. 项目概述&#xff1a;一个面向技能复现与创造的AI工具集最近在GitHub上看到一个挺有意思的项目&#xff0c;叫“skill-creator-pro”。光看这个名字&#xff0c;你可能会有点摸不着头脑&#xff0c;这到底是做什么的&#xff1f;是教人学技能的&#xff0c;还是生成技能的&a…...

039对称二叉树

对称二叉树 题目链接&#xff1a;https://leetcode.cn/problems/symmetric-tree/description/?envTypestudy-plan-v2&envIdtop-100-liked 我的解答&#xff1a; //方法一&#xff1a;递归 //时间复杂度&#xff1a;O(n) //空间复杂度&#xff1a;O(n) public boolean isSy…...

PlantUML Editor:5分钟学会用代码绘制专业UML图的终极工具

PlantUML Editor&#xff1a;5分钟学会用代码绘制专业UML图的终极工具 【免费下载链接】plantuml-editor PlantUML online demo client 项目地址: https://gitcode.com/gh_mirrors/pl/plantuml-editor 还在为复杂的UML图表绘制而烦恼吗&#xff1f;PlantUML Editor是一款…...

RMSNorm:均方根归一化总结

RMSNorm&#xff1a;均方根归一化总结 1. RMSNorm 是什么&#xff1f; RMSNorm 的全称是 Root Mean Square Normalization&#xff0c;中文可以叫&#xff1a;均方根归一化它是 Transformer 大模型中常用的一种归一化方法&#xff0c;例如 LLaMA、Qwen、DeepSeek、Gemma 等模型…...

如何用4个步骤构建你的开源六轴机械臂:完整DIY指南

如何用4个步骤构建你的开源六轴机械臂&#xff1a;完整DIY指南 【免费下载链接】Faze4-Robotic-arm All files for 6 axis robot arm with cycloidal gearboxes . 项目地址: https://gitcode.com/gh_mirrors/fa/Faze4-Robotic-arm Faze4-Robotic-arm是一个开源六轴机械臂…...

疯狂五月:AI 化身最强“神探”,重塑网络安全攻防战

原文链接&#xff1a;AI 小老六 在网络安全领域&#xff0c;每个月的第二个星期二被称为“补丁星期二&#xff08;Patch Tuesday&#xff09;”&#xff0c;是微软等科技巨头集中发布安全更新的日子。然而&#xff0c;2026 年 5 月的这一天显得格外特殊——整个科技圈正在经历一…...

LSMO薄膜金属-绝缘体相变及其随机性应用研究

1. 理解LSMO薄膜中的随机性现象La0.67Sr0.33MnO3&#xff08;LSMO&#xff09;是一种典型的强关联电子体系材料&#xff0c;其独特的金属-绝缘体相变&#xff08;MIT&#xff09;特性为开发新型计算范式提供了物理基础。这种材料在相变临界区域表现出的随机性行为&#xff0c;源…...

AI应用成本监控实战:基于令牌预算的LLM API调用管理与优化

1. 项目概述与核心价值最近在折腾AI应用开发&#xff0c;特别是那些基于大语言模型API&#xff08;比如OpenAI、Anthropic、Claude等&#xff09;的项目时&#xff0c;有一个痛点越来越明显&#xff1a;成本控制。你写了个聊天机器人&#xff0c;或者搞了个自动摘要工具&#x…...