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(),如下:

?

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/697549.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/697549.shtml
英文地址,請注明出處:http://en.pswp.cn/news/697549.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

云計算面試題【后期】

前言&#xff1a; 隨著年齡的增長生活瑣碎的事情、煩心的事情日漸增多&#xff0c;怠慢了更新&#xff0c; 1.什么是數據庫 DB.DataBase 數據庫&#xff1a; 依照某種數據模型進行組織并存放到存儲器的數據集合 DBMS.DataBase Management System – 數據庫管理系統&#xff1a;…

Java MP3轉PCM

Java MP3轉PCM 1 添加依賴2 Java 代碼 1 添加依賴 <dependency><groupId>com.googlecode.soundlibs</groupId><artifactId>mp3spi</artifactId><version>1.9.5.4</version> </dependency>2 Java 代碼 package com.xu.music.…

迪蕭科技有限公司邀您參觀2024生物發酵展

參展企業介紹 浙江迪蕭科技有限公司位于浙江杭州&#xff0c;是一家專注于膜技術的國家高新企業。公司針對食品飲料、醫藥保健等領域的過程分離與控制、產品提取及濃縮、廢料資源化利用等提供全方案解決服務。堅持以“顧客至上、優質服務、卓越品質”為原則。為客戶企業提供清…

視頻批量瘦身:一鍵縮小尺寸,輕松處理海量視頻

在如今視頻內容爆炸的時代&#xff0c;無論是個人創作者還是企業團隊&#xff0c;都面臨著處理大量視頻的需求。而視頻尺寸過大往往會導致上傳緩慢、存儲空間不足等問題。為了解決這個問題&#xff0c;我們推出了一款強大的視頻批量剪輯工具&#xff0c;讓你輕松實現視頻尺寸批…

NXP實戰筆記(七):S32K3xx基于RTD-SDK在S32DS上配置ICU輸入捕獲

目錄 1、概述 2、輸入捕獲SDK配置 2.1、SAIC中斷方式 2.2、IPWM或者IPM 1、概述 輸入捕獲&#xff0c;可以抓取高電平時間、低電平時間、占空比、周期、邊沿檢測與回調函數、邊沿計數&#xff08;ABZ解碼&#xff09;、時間戳、喚醒中斷。 記錄一下根據Emios模塊實現上述部分…

Spring Cache框架使用教程,通過簡單且強大的方式在應用程序中使用緩存提高性能

Spring Cache Spring Cache 框架是 Spring 框架的一部分,它提供了一種簡單但功能強大的方式來在應用程序中實現緩存。下面是 Spring Cache 框架的一些好處: 性能提升: 使用緩存可以大大提高應用程序的性能,特別是對于那些需要頻繁訪問和計算的數據。通過緩存先前計算的結果…

【ARMv8M Cortex-M33 系列 8.1 -- RT-Thread 堆內存 檢查命令 free 實現及介紹】

文章目錄 RT-Thread 堆內存 檢查命令 free 實現及介紹rt_memory_info 函數驗證 RT-Thread 堆內存 檢查命令 free 實現及介紹 在RT-Thread系統中&#xff0c;通常可以通過rt_memory_info函數獲取當前的堆內存使用信息&#xff0c;然后你可以包裝這個函數來顯示剩余的堆空間。rt…

最全整理,軟件測試-Web頁面測試思路總結,13年經驗...

目錄&#xff1a;導讀 前言一、Python編程入門到精通二、接口自動化項目實戰三、Web自動化項目實戰四、App自動化項目實戰五、一線大廠簡歷六、測試開發DevOps體系七、常用自動化測試工具八、JMeter性能測試九、總結&#xff08;尾部小驚喜&#xff09; 前言 1、Web功能測試 …

Vim 模式切換 | 命令集

Vim 模式切換 | 命令集 vim 主要模式及切換一、正常/普通/命令模式1 光標相關操作命令集1.1 光標移動1.2 文字刪除1.3 粘貼和復制1.4 替換1.5 字符更改 二、插入模式2.1 插入模式和命令行模式相互切換 三、末行模式2.1 末行模式和命令行模式相互切換2.2 末行模式相關命令集 vim…

【EI會議征稿通知】第十屆機械工程、材料和自動化技術國際會議(MMEAT 2024)

2024年第十屆機械工程、材料和自動化技術國際會議(MMEAT 2024) 2024 10th International Conference on Mechanical Engineering,Materials and Automation Technology 2024年第十屆機械工程、材料和自動化技術國際會議( MMEAT 2024) 將于2024年06月21-23日在中國武漢舉行。MM…

【LeetCode每日一題】單調棧316去除重復字母

題目&#xff1a;去除重復字母 給你一個字符串 s &#xff0c;請你去除字符串中重復的字母&#xff0c;使得每個字母只出現一次。需保證 返回結果的字典序最小&#xff08;要求不能打亂其他字符的相對位置&#xff09;。 示例 1&#xff1a; 輸入&#xff1a;s “bcabc” 輸…

docker自定義網絡實現容器之間的通信

Background docker原理 docker是一個Client-Server結構的系統&#xff0c;Docker的守護進程運行在主機上。通過Socket從客戶端訪問。docker核心三大組件&#xff1a;image–鏡像、container-容器、 repository-倉庫。docker使用的cpu、內存以及系統內核等資源都是直接使用宿主…

python 函數-04-參數收集-帶1個或2個星號

一個函數&#xff0c;至多可以帶一個一星參數&#xff08;收集位置參數&#xff09;&#xff0c;加上一個二星參數&#xff08;收集關鍵字參數&#xff09;。 01 一個星號參數 入參為不定參數&#xff08;參數個數不確定&#xff09;&#xff0c;此時在定義參數時&#xff0c…

最簡單方式把jar打包成Windows服務

廢話 &#x1f622; 將JAR文件轉化為Windows服務是一種高效且常見的Java應用部署策略。這種轉變賦予了Java應用程序在Windows操作系統上以無界面后臺服務模式運行的能力&#xff0c;從而實現了持續、穩定且可靠的功能提供。這種部署方式不僅提升了應用的可用性&#xff0c…

Python學習筆記——類(編程風格)

編寫的應用比較復雜時&#xff0c;特別是大型項目&#xff0c;團隊分工協同&#xff0c;尤其要注意編程風格。 &#xff08;1&#xff09;類名應采用駝峰命名法&#xff0c;即將類名中的每個單詞的首字母都大寫&#xff08;類名的首字母是大寫的&#xff09;&#xff0c;并且不…

導入excel某些數值是0

目錄 導入excel某些數值是0數據全部都是0原因解決 部分數據是0原因解決 導入excel某些數值是0 數據全部都是0 有一列“工單本月入庫重量”全部的數據都是0 原因 展示的時候&#xff0c;展示的字段和內表需要展示的字段不一致&#xff0c;導致顯示的是0。 解決 修改展示的字…

kubernetes面試題及核心知識點

無狀態負載deployment有狀態管理 &#xff1a; config配置文件 secret密碼文件 內置volumn插件 1、emptyDir宿主機的存儲為容器分配資源。臨時儲存&#xff0c;隨著pod的刪除而消失&#xff0c; 2、hostPath宿主機的存儲為容器分配資源。不會隨著pod的刪除而消失&#xf…

Video generation models as world simulators-視頻生成模型作為世界模擬器

原文地址&#xff1a;Video generation models as world simulators 我們探索在視頻數據上進行大規模生成模型的訓練。具體來說&#xff0c;我們聯合訓練文本條件擴散模型&#xff0c;同時處理不同持續時間、分辨率和長寬比的視頻和圖像。我們利用一個在視頻和圖像潛在編碼的時…

AGI|AI到底如何生成視頻?Sora究竟為何能引爆科技圈?

目錄 一、AI生成視頻引發新浪潮 二、生成方法及難點 三、Sora的突破進展 &#xff08;一&#xff09;可生成不同尺寸視頻 &#xff08;二&#xff09;可生成1分鐘時長視頻 &#xff08;三&#xff09;圖片生成視頻 &#xff08;四&#xff09;場景一致性 &#xff08;五…

Window部署Exceptionless

Exceptionless Elasticsearch 版本&#xff1a; Exceptionless&#xff1a;8.1.0 Elasticsearch&#xff1a;7.17.5 JDK&#xff1a;11.0.10 目錄 一、Elasticsearch運行 二、 Exceptionless 一、Elasticsearch運行 bin目錄下elasticsearch.bat 直接運行 訪問 http://lo…