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

vue3获取两个日期之间的所有时间

1.获取两个日期之间所有年月日

如图所示:在这里插入图片描述
代码如下:

<template><div class="datePicker"><el-date-pickerv-model="value1"type="daterange"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"@change="datePickerChange"format="YYYY-MM-DD"value-format="YYYY-MM-DD"/></div>
</template><script setup lang="ts">
import { ref} from "vue";
const value1 = ref("");
const betweenData = ref([]);
const datePickerChange = (value) => {betweenData.value = []; // 清空之前的日期列表const start = new Date(value[0]);const end = new Date(value[1]);const currentDate = new Date(start);while (currentDate <= end) {betweenData.value.push(new Date(currentDate).toISOString().split("T")[0]); currentDate.setDate(currentDate.getDate() + 1);}
};
</script>

2.获取两个日期之间所有年月

如图所示:
在这里插入图片描述
代码如下:

<template><div class="datePicker"><el-date-pickerv-model="value1"type="monthrange"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"@change="datePickerChange"format="YYYY-MM"value-format="YYYY-MM"/></div>
</template><script setup lang="ts">
import { ref} from "vue";
const value1 = ref("");
const betweenData = ref([]);
const datePickerChange = (value) => {betweenData.value = []; // 清空之前的日期列表const start = new Date(value[0]);const end = new Date(value[1]);const currentDate = new Date(start);while (currentDate <= end) {betweenData.value.push(currentDate.getFullYear() +"-" + (currentDate.getMonth() + 1).toString().padStart(2, "0")); currentDate.setMonth(currentDate.getMonth() + 1); currentDate.setDate(1);}
};
</script>

3.获取两个日期之间所有年

如图所示:
在这里插入图片描述
代码如下:

<template><div class="datePicker"><el-date-pickerv-model="value1"type="monthrange"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"@change="datePickerChange"format="YYYY-MM"value-format="YYYY-MM"/></div>
</template><script setup lang="ts">
import { ref} from "vue";
const value1 = ref("");
const betweenData = ref([]);
const datePickerChange = (value) => {betweenData.value = []; // 清空之前的日期列表const start = new Date(value[0]);const end = new Date(value[1]);const currentDate = new Date(start);while (currentDate <= end) {betweenData.value.push(currentDate.getFullYear());currentDate.setFullYear(currentDate.getFullYear() + 1);}
};
</script>

Only those who capture the moment are real.

http://www.xdnf.cn/news/9059.html

相关文章:

  • 解决leetcode第3509题.最大化交错和为K的子序列乘积
  • OceanBase数据库全面解析(高级特性篇)
  • Real2Render2Real:无需动力学仿真或机器人硬件即可扩展机器人数据
  • AI智能混剪核心技术解析(一):字幕与标题生成的三大支柱-字幕与标题生成-优雅草卓伊凡
  • 海思3519V200ARM Linux 下移植 Qt5.8.0
  • 开疆智能Profinet转Profibus网关连接丹佛斯FC300变频器配置案例
  • Windows11+WSL2+Ubuntu22 安装
  • 汽车恒温器行业2025数据分析报告
  • 【Pandas】pandas DataFrame drop_duplicates
  • 【springMVC】springMVC学习系列一:springMVC的组件
  • 调度算法中的轮盘赌与锦标赛选择算子:优势对比与选择策略
  • 创建一个简易的风扇动画界面:基于 WPF 和 XAML 的实现教程
  • 第Y1周打卡——调用官方权重进行检测
  • 每日算法 -【Swift 算法】字符串转整数算法题详解:myAtoi 实现与正则表达式对比
  • 直线参数方程何时必须化为标准形式 |新高考已删
  • golang channel 的特点、原理及使用场景
  • 人工智能 - Magentic-UI与Browser Use 技术选型
  • C++基础算法————递推
  • Neural Blind Deconvolution Using Deep Priors论文阅读
  • 【Dify系列教程重置精品版】第十章:Dify与RAG
  • Guard Trace 值得吗?
  • 3.python操作mysql数据库
  • 切换目录大全
  • Voice Conversion语音转换
  • PHP:赋能Web开发的经典语言与未来演进
  • XSS跨站脚本攻击的原理、危害与防御
  • 基于PDF流式渲染的Word文档在线预览技术
  • 用MMdetection框架训练自己的数据集(全流程实战)
  • GitAny - 無需登入的 GitHub 最新倉庫檢索工具
  • AbMole| Erastin(571203-78-6,M2679,铁死亡诱导剂)