常用日期组件封装

news2024/10/6 22:27:01

 date.js

// 获取近期日期数组 例:["2024-04-04 00:00:00", "2024-04-05 23:59:59"]
const getDateRange = (num = 1) => {
  const time1 = new Date()
  const diff = new Date().getTime() - 86400000 * (num)
  const time2 = new Date(diff)
  const year1 = time1.getFullYear()
  let month1 = time1.getMonth() + 1
  let day1 = time1.getDate()
  if (month1 < 10) { month1 = '0' + month1 }
  if (day1 < 10) { day1 = '0' + day1 }
  const year2 = time2.getFullYear()
  let month2 = time2.getMonth() + 1
  let day2 = time2.getDate()
  if (month2 < 10) { month2 = '0' + month2 }
  if (day2 < 10) { day2 = '0' + day2 }


  let h = time1.getHours()
  let m = time1.getMinutes()
  let s = time1.getSeconds()
  if (h >= 0 && h <= 9) h = '0' + h
  if (m >= 0 && m <= 9) m = '0' + m
  if (s >= 0 && s <= 9) s = '0' + s
  if(day1==1){
    month1= month2
  }
  let str1 = year1 + '-' + month1 + '-' + day1 + ' ' + h + ':' + m + ':' + s
  let str2 = year2 + '-' + month2 + '-' + day2 + ' ' + h + ':' + m + ':' + s
  // 近一日
  if (num == 1) {
    str2 = year2 + '-' + month2 + '-' + day1 + ' ' + '00:00:00'
  }
  return [str2, str1]
}

// 获取今日日期 例:"2024-04-04"
const getCurrentDay = (param = '') => {
  const time = param ? new Date(param) : new Date()
  const year = time.getFullYear()
  let month = time.getMonth() + 1
  let day = time.getDate()
  if (month < 10) { month = '0' + month }
  if (day < 10) { day = '0' + day }
  const str = year + '-' + month + '-' + day
  return str
}

// 获取当前日期时间 例:"2024-04-04 11:24:56"
const getCurrentDate = (param = '') => {
  const time = param ? new Date(param) : new Date()
  const year = time.getFullYear()
  let month = time.getMonth() + 1
  let day = time.getDate()
  let h = time.getHours()
  let m = time.getMinutes()
  let s = time.getSeconds()
  if (month < 10) month = '0' + month
  if (day < 10) day = '0' + day
  if (h >= 0 && h <= 9) h = '0' + h
  if (m >= 0 && m <= 9) m = '0' + m
  if (s >= 0 && s <= 9) s = '0' + s
  const str = year + '-' + month + '-' + day + ' ' + h + ':' + m + ':' + s
  return str
}

export { getDateRange, getCurrentDay, getCurrentDate }

具体使用

<script setup>
import { getDateRange, getCurrentDay, getCurrentDate  } from "@/api/date.js";

const container = ref(null);
const handleScroll = () => {
 const assd1=   getDateRange()
 console.log('获取近期日期数组',assd1);
 const assd2=   getCurrentDay()
 console.log('获取今日日期',assd2);
 const assd3=   getCurrentDate()
 console.log('获取当前日期时间',assd3);
}
handleScroll()





</script>

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

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

相关文章

Canvas使用详细教学:从基础绘图到进阶动画再到实战(海报生成、Flappy Bird 小游戏等),掌握绘图与动画的秘诀

一、Canvas基础 1. Canvas简介 Canvas是HTML5引入的一种基于矢量图形的绘图技术&#xff0c;它是一个嵌入HTML文档中的矩形区域&#xff0c;允许开发者使用JavaScript直接操作其内容进行图形绘制。Canvas元素不包含任何内在的绘图能力&#xff0c;而是提供了一个空白的画布&a…

LLM-01 大模型 本地部署运行 ChatGLM2-6B-INT4(6GB) 简单上手 环境配置 单机单卡多卡 2070Super8GBx2 打怪升级!

写在前面 其他显卡环境也可以&#xff01;但是最少要有8GB的显存&#xff0c;不然很容易爆。 如果有多显卡的话&#xff0c;单机多卡也是很好的方案&#xff01;&#xff01;&#xff01; 背景介绍 目前借到一台算法组的服务器&#xff0c;我们可以查看一下目前显卡的情况 …

一篇出色的答辩状,需要在“答”与“辩”两方面下功夫,你做到了吗?

一篇出色的答辩状&#xff0c;需要在“答”与“辩”两方面下功夫&#xff0c;你做到了吗&#xff1f; 在法律诉讼中&#xff0c;答辩状的重要性不言而喻。它不仅是你回应对方指控的主要手段&#xff0c;也是展示你立场和观点的关键平台。在#李秘书讲写作#看来&#xff0c;一篇…

5.HC-05蓝牙模块

配置蓝牙模块 注意需要将蓝牙模块接5v,实测接3.3v好像不太好使的样子 首先需要把蓝牙模块通过TTL串口模块接到我们的电脑,然后打开我们的串口助手 注意,我们现在是配置蓝牙模块,所以需要进入AT模式,需要按着蓝牙模块上的黑色小按钮再上电,这时候模块上的LED灯以一秒慢闪一次…

Adobe AE(After Effects)2024下载地址及安装教程

Adobe After Effects是一款专业级别的视觉效果和动态图形处理软件&#xff0c;由Adobe Systems开发。它被广泛用于电影、电视节目、广告和其他多媒体项目的制作。 After Effects提供了强大的合成和特效功能&#xff0c;可以让用户创建出令人惊艳的动态图形和视觉效果。用户可以…

Python 物联网入门指南(七)

原文&#xff1a;zh.annas-archive.org/md5/4fe4273add75ed738e70f3d05e428b06 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 第二十四章&#xff1a;基本开关 到目前为止一定是一段史诗般的旅程&#xff01;回想一下你开始阅读这本书的时候&#xff0c;你是否曾想象…

【产品介绍】安科瑞Acrel-2000T无线测温解决方案

ARTM-Pn 无线测温采集装置&#xff0c;可用于3~35kV 户内开关柜&#xff0c;包括中置柜、手车柜、固定柜、环网柜等多种开关柜&#xff0c;也可用于 0.4kV 低压柜&#xff0c;包括固定柜&#xff0c;抽屉柜等。无线温度传感器可安装于柜内任何发热点上&#xff0c;利用无线数据…

跨境物流系统解决方案:构建全球化供应链的关键步骤

随着全球化的发展&#xff0c;跨境物流已成为国际贸易中不可或缺的重要环节。然而&#xff0c;由于各国之间的政治、法律、文化和语言差异&#xff0c;跨境物流常常面临诸多挑战&#xff0c;如货物清关、运输安全、物流跟踪等问题。因此&#xff0c;构建一个高效、可靠的跨境物…

Windows如何下载Bun并在前端Vue或React项目上替代Yarn或Npm

Bun Bun网站 Bun 在 Windows 上下载并安装 Bun 非常简单。你可以使用以下命令在 Windows 10 或更高版本上安装 Bun powershell -c "irm bun.sh/install.ps1 | iex"“powershell”不是内部或外部命令&#xff0c;也不是可运行的程序或批处理文件 PowerShell 命令解决…

嵌入式第四天:(C语言入门)

目录 什么是数组&#xff1f; 数组&#xff1a; 数组的使用&#xff1a; 数组的初始化&#xff1a; 数组名&#xff1a; 数组案例&#xff1a; 一维数组的最大值&#xff1a; 一维数组的逆置&#xff1a; 数组和指针&#xff1a; 通过指针操作数组元素&#xff1a; …

UART自适应任意(典型)波特率原理以及FPGA实现

文章目录 前言一、特征值自适应原理二、整体结构框图三、接收模块四、发送模块五、编写仿真测试文件以及结果分析六、上板测试参考 前言 在上一篇文章《详解UART通信协议以及FPGA实现》我们实现了UART的通信&#xff0c;我们知道UART通信需要双方约定好波特率&#xff0c;如果想…

Hadoop大数据处理技术-配置连接篇

​2024/4/17 Hadoop学习前的准备 3&#xff09;连接虚拟机 上一节配置完成了基础的虚拟机配置及网络配置 下面我们开始建立连接 我们为什么要与虚拟机建立链接呢&#xff1f; 连接虚拟机就好像跟亲友联系一样 总得找个便捷又好用的工具才行 Secure CRT就像是一把能打开通向…

材料物理 笔记-6

原内容请参考哈尔滨工业大学何飞教授&#xff1a;https://www.bilibili.com/video/BV18b4y1Y7wd/?p12&spm_id_frompageDriver&vd_source61654d4a6e8d7941436149dd99026962 或《材料物理性能及其在材料研究中的应用》&#xff08;哈尔滨工业大学出版社&#xff09; 文…

手写spring IOC底层源码来模拟spring如何利用多级缓存解决循环依赖的问题

在文章开始之前&#xff0c;先来看一张spring IOC加载过程的脑图吧 Spring IOC的加载过程 首先,当我们去new了一个applicationContext,它底层呢就会把我们配置的bean进行扫描,然后创建成一个一个的beanDefinition放在我们的beanDefinitionMap中,此时就有了一切创造bean的原料信…

k-means聚类算法的MATLAB实现及可视化

K-means算法是一种无监督学习算法&#xff0c;主要用于数据聚类。其工作原理基于迭代优化&#xff0c;将数据点划分为K个集群&#xff0c;使得每个数据点都属于最近的集群&#xff0c;并且每个集群的中心&#xff08;质心&#xff09;是所有属于该集群的数据点的平均值。以下是…

「GO基础」文件名规范、关键字与标识符

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

【数据结构与算法】最大公约数与最小公倍数

最大公因数&#xff08;英语&#xff1a;highest common factor&#xff0c;hcf&#xff09;也称最大公约数&#xff08;英语&#xff1a;greatest common divisor&#xff0c;gcd&#xff09;是数学词汇&#xff0c;指能够整除多个非零整数的最大正整数。例如8和12的最大公因数…

社交创新的标杆:解读Facebook的社交模式

引言 在当今数字化时代&#xff0c;社交媒体已成为人们日常生活和沟通的重要工具。作为全球最大的社交媒体平台&#xff0c;Facebook不仅改变了我们的社交模式&#xff0c;而且对全球的社交文化、商业活动和公共事务产生了深远的影响。本文将深入探讨Facebook的社交模式&#…

关于Qt主窗口的菜单部件

前言 在介绍主窗口的两大部件之前&#xff0c;我们要先知道关于主窗口的一些知识。 主窗口 一个主窗口可以没有菜单条、工具条、状态条&#xff0c;但必须设置中心部件。在 Q 生成的 C头文件 ui_mainwindow.h 代码中,我们可以看到以下代码: centralWidget new Qwidget(MainWi…

Three.js加载glb / gltf模型,Vue加载glb / gltf模型(如何在vue中使用three.js,vue使用threejs加载glb模型)

简介&#xff1a;Three.js 是一个用于在 Web 上创建和显示 3D 图形的 JavaScript 库。它提供了丰富的功能和灵活的 API&#xff0c;使开发者可以轻松地在网页中创建各种 3D 场景、模型和动画效果。可以用来展示产品模型、建立交互式场景、游戏开发、数据可视化、教育和培训等等…