开发需求总结19-vue 根据后端返回一年的数据,过滤出符合条件数据

需求描述:

定义时间分界点:每月26号8点,过了26号8点则过滤出data数组中符合条件数据下个月的数据,否则过滤出当月数据

1.假如现在是2024年11月14日,那么过滤出data数组中日期都是2024-11月的数据;

2.假如现在是2024年11月26号8点之后,那么就过滤出data数组中11月之后下个月的数据,也就是12月的数据。

后端返回数据:

返回如下格式,过滤出符合需求条件的数据

let data = [{month: '2023-12', name: '111'}, {month: '2023-12', name: '111'}, {month: '2023-12', name: '111'}, {month: '2024-12', name: '111'},{month: '2023-11', name: '111'}, {month: '2023-11', name: '111'}, {month: '2023-11', name: '111'}, {month: '2024-11', name: '111'},{month: '2023-10', name: '111'},{month: '2023-10', name: '111'},{month: '2023-10', name: '111'},{month: '2024-10', name: '111'},{month: '2023-09', name: '111'}, {month: '2023-09', name: '111'},{month: '2023-09', name: '111'}, {month: '2024-09', name: '111'},{month: '2023-08', name: '111'}, {month: '2023-08', name: '111'},{month: '2023-08', name: '111'},{month: '2024-08', name: '111'},{month: '2023-07', name: '111'}, {month: '2023-07', name: '111'},{month: '2023-07', name: '111'},{month: '2024-07', name: '111'},{month: '2023-06', name: '111'}, {month: '2023-06', name: '111'},{month: '2023-06', name: '111'},{month: '2024-06', name: '111'},{month: '2023-05', name: '111'}, {month: '2023-05', name: '111'}, {month: '2023-05', name: '111'}, {month: '2024-05', name: '111'},{month: '2023-04', name: '111'}, {month: '2023-04', name: '111'},{month: '2023-04', name: '111'},{month: '2024-04', name: '111'},{month: '2023-03', name: '111'}, {month: '2023-03', name: '111'}, {month: '2023-03', name: '111'}, {month: '2024-03', name: '111'},{month: '2023-02', name: '111'}, {month: '2023-02', name: '111'}, {month: '2023-02', name: '111'}, {month: '2024-02', name: '111'},{month: '2023-01', name: '111'}, {month: '2023-01', name: '111'}, {month: '2023-01', name: '111'}, {month: '2024-01', name: '111'}
]

代码实现:

// 定义数据数组(这里只展示部分,完整数据请看上方)
let data = [{month: '2023-12', name: '111'},// ... (其他数据项){month: '2024-11', name: '111'}// ... (确保包含2024-12的数据以测试下个月的情况)
];// 获取当前日期和时间
var now = new Date();
var currentYear = now.getFullYear();
var currentMonth = now.getMonth() + 1; // 注意月份从0开始,需要加1
var currentDay = now.getDate();
var currentHour = now.getHours();// 定义分界点日期和时间
var cutoffDay = 26;
var cutoffHour = 8;// 根据当前日期和时间以及分界点确定要过滤的月份
function getTargetMonth(currentYear, currentMonth, currentDay, currentHour, cutoffDay, cutoffHour) {if (currentDay < cutoffDay || (currentDay === cutoffDay && currentHour < cutoffHour)) {// 如果今天在当前月的26号8点之前return currentYear + '-' + String(currentMonth).padStart(2, '0');} else {// 如果今天在当前月的26号8点或之后var nextMonth = (currentMonth % 12 === 0) ? 1 : currentMonth + 1;var nextYear = (currentMonth === 12) ? currentYear + 1 : currentYear; // 更简洁的判断下一年return nextYear + '-' + String(nextMonth).padStart(2, '0');}
}// 获取目标月份字符串
var targetMonth = getTargetMonth(currentYear, currentMonth, currentDay, currentHour, cutoffDay, cutoffHour);// 过滤数据数组,只保留目标月份的数据
var filteredData = data.filter(function(item) {return item.month === targetMonth;
});// 输出结果(在实际应用中,你可能会将这些数据用于渲染或其他逻辑)
console.log('当前日期和时间:', now.toLocaleString());
console.log('目标月份:', targetMonth);
console.log('过滤后的数据:', filteredData);

注意

        可能存在跨年份的情况(例如,从12月8点后过滤到次年的1月)。

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

小程序-基于java+SpringBoot+Vue的戏曲文化苑小程序设计与实现

项目运行 1.运行环境&#xff1a;最好是java jdk 1.8&#xff0c;我们在这个平台上运行的。其他版本理论上也可以。 2.IDE环境&#xff1a;IDEA&#xff0c;Eclipse,Myeclipse都可以。推荐IDEA; 3.tomcat环境&#xff1a;Tomcat 7.x,8.x,9.x版本均可 4.硬件环境&#xff1a…

【C/C++】内存管理详解:从new/delete到智能指针的全面解析

文章目录 更多文章C/C中的传统内存管理方式new和delete运算符malloc和free函数传统内存管理的弊端 智能指针的崛起智能指针的定义与作用C11引入的标准智能指针 详解C标准智能指针std::unique_ptr特点使用方法适用场景 std::shared_ptr特点使用方法适用场景 std::weak_ptr特点使…

通过 SSH 进行WordPress网站的高级服务器管理

我在管理hostease的服务器时&#xff0c;时常需要通过SSH登录服务器进行修改。而在网站管理中&#xff0c;SSH不仅是一个基础工具&#xff0c;更是高级用户用来精细化管理和优化服务器的重要工具。通过SSH&#xff0c;你可以深入监控服务器的性能、精细管理系统资源&#xff0c…

MFC 对话框中显示CScrollView实例

有时候我们需要在对话框中显示CScrollView效果的控件&#xff0c;类似于以下效果&#xff1a; 使用实例可参考&#xff1a;MFC对话框显示CScrollView例子_哔哩哔哩_bilibili 创建CScrollView中显示的子对话框与子类&#xff1a; 两个对话框对应的类&#xff1a; CScrollView继…

vue3 ajax获取json数组排序举例

使用axios获取接口数据 可以在代码中安装axios包&#xff0c;并写入到package.json文件&#xff1a; npm install axios -S接口调用代码举例如下&#xff1a; const fetchScore async () > {try {const res await axios.get(http://127.0.0.1:8000/score/${userInput.v…

详解登录MySQL时出现SSL connection error: unknown error number错误

目录 登录MySQL时出错SSL connection error: unknown error number 出错原因 使用MySQL自带的工具登录MySQL 登陆之后&#xff0c;使用如下命令进行查看 解决方法 找到MySQL8安装目录下的my.ini配置文件 记事本打开my.ini文件&#xff0c;然后按下图所示添加配置 此时再…

mini-spring源码分析

IOC模块 关键解释 beanFactory&#xff1a;beanFactory是一个hashMap, key为beanName, Value为 beanDefination beanDefination: BeanDefinitionRegistry&#xff0c;BeanDefinition注册表接口&#xff0c;定义注册BeanDefinition的方法 beanReference&#xff1a;增加Bean…

linux内核读写硬盘文件 kernel_writekernel_read

简介 在内核中读取硬盘文件&#xff0c;内核5.10测试了下&#xff0c;可以正常运行。 代码 1. 使用filp_open打开文件 2. 使用kernel_write和kernel_read读写文件 3. 使用filp_close关闭文件 #include <linux/module.h> #include <linux/init.h> #include &l…

记录一次 k8s 节点内存不足的排查过程

背景&#xff1a;前端服务一直报404&#xff0c;查看k8s日志&#xff0c;没发现报错&#xff0c;但是发现pods多次重启。 排查过程&#xff1a; 查看pods日志&#xff0c;发现日志进不去。 kubectrl logs -f -n weave pod-name --tail 100查看pod describe kubectl describ…

微软要求 Windows Insider 用户试用备受争议的召回功能

拥有搭载 Qualcomm Snapdragon 处理器的 Copilot PC 的 Windows Insider 计划参与者现在可以试用 Recall&#xff0c;这是一项臭名昭著的快照拍摄 AI 功能&#xff0c;在今年早些时候推出时受到了很多批评。 Windows 营销高级总监 Melissa Grant 上周表示&#xff1a;“我们听…

嵌入式Qt使用ffmpeg视频开发记录

在此记录一下Qt下视频应用开发的自学历程&#xff0c;可供初学者参考和避雷。 了解常用音频格式yuv420p、h264等了解QML&#xff0c;了解QVideoOutput类的使用&#xff0c;实现播放yuv420p流参考ffmpeg官方例程&#xff0c;调用解码器实现h264解码播放 不需要手动分帧。ffmpeg…

Web day02 Js Vue Ajax

目录 1.javascript: 1.js的引入方式&#xff1a; 2.js变量 & 数据类型 & 输出语句&#xff1a; 模板字符串&#xff1a; 3.函数 & 自定义对象&#xff1a; 4. json 字符串 & DOM操作&#xff1a; 5. js事件监听&#xff1a; 6.js的模块化导入或者导出&a…

Qt Graphics View 绘图实例

Qt Graphics View 绘图实例 这个实例程序实现如下功能&#xff1a; 可以创建矩形、椭圆、三角形、梯形、直线、文字等基本图形。每个图形项都可以被选择和移动。图形项或整个视图可以缩放和旋转。图形项重叠时&#xff0c;可以调整前置或后置。多个图形项可以组合&#xff0c;…

TCP socket api详解 续

文章目录 守护进程怎么做到&#xff1f;setsid返回值 dev/null字符文件 daemonTCP协议 退出的时候呢&#xff1f; 会话有很多后台任务&#xff0c;bash肯定会退&#xff0c;那后台会话怎么办呢&#xff1f; 理论上也要退的&#xff0c;但实际上关了bash&#xff0c;bash肯定要…

06_数据类型

数据类型 数据类型分类 JavaScript 语言的每一个值,都属于某一种数据类型。JavaScript 的数据类型,共有六种。(ES6 又新增了第七种 Symbol 类型的值和第八种 BigInt类型,当前课程暂不涉及) 据类型分类 原始类型(基础类型) var age = 20, var name = 尚学堂"; var le…

scrapy豆瓣爬虫增强-批量随机请求头

1.1 豆瓣爬虫增强,中间件随机请求头 1.2 清除原有的中间件,进行中间件测试 1.3 导入全新的中间件 1.4 运行爬虫,这个时候的请求头是固定的 1.5 强化对agent的输出,会舍弃输出cookie,使输出更明了 1.6 转移输出请求头位置 新增输出 造成这样问题的原因是Douban/Douban/settings…

非关系型数据库有哪些特点?

非关系型数据库&#xff08;NoSQL&#xff09;具有以下主要特点‌&#xff1a;‌1 ‌灵活的数据存储方式‌&#xff1a;非关系型数据库不采用传统的基于表格的数据存储方式&#xff0c;而是采用更加灵活的数据存储方式。它可以存储各种类型的数据&#xff0c;包括文本、图像、音…

智慧防汛平台在城市生命线安全建设中的应用

随着城市化进程的加快&#xff0c;城市基础设施的复杂性和互联性不断增强&#xff0c;城市生命线的安全管理面临前所未有的挑战。智慧防汛平台作为城市生命线安全建设的重要组成部分&#xff0c;通过现代信息技术提升城市防汛应急管理的智能化水平&#xff0c;保障城市安全。 …

【ChatGPT大模型开发调用】如何获得 OpenAl API Key?

如何获取 OpenAI API Key 获取 OpenAI API Key 主要有以下三种途径&#xff1a; OpenAI 官方平台 (推荐): 开发者用户可以直接在 OpenAI 官方网站 (platform.openai.com) 注册并申请 API Key。 通常&#xff0c;您可以在账户设置或开发者平台的相关页面找到申请入口。 Azure…

vue3 发送 axios 请求时没有接受到响应数据

<script setup> import Edit from ./components/Edit.vue import axios from axios import { onMounted,ref } from vue// TODO: 列表渲染 //装数据的列表 const list ref([]) const count ref(0) const getList async () > {//通过发送 /list 请求从后端拿到列表数…