vue.js定时任务：根据时间动态调整api参数
在Vue.js应用中，定时调用API获取数据很常见。有时，API参数需要根据当前时间动态调整。例如，本文演示如何实现：下午5点前，API参数使用当天日期；5点后，使用次日日期。
核心在于根据当前时间动态生成API请求参数并触发定时任务。 setInterval函数用于定时调用，Date对象获取当前时间，判断是否超过下午5点。
以下代码片段展示实现方法：
vue-composition-api-best-practices
下载
Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。
const runHandler = () => {
setInterval(() => {
const now = new Date();
const hour = now.getHours();
const dateString = hour < 17 ? formatDate(now) : formatDate(addDays(now, 1));
runHttpRequest(dateString);
}, 60000); // 每分钟执行一次
};
const formatDate = (date) => {
// 使用合适的日期格式化函数，例如moment.js
return moment(date).format('YYYY-MM-DD');
};
const addDays = (date, days) => {
const newDate = new Date(date);
newDate.setDate(newDate.getDate() + days);
return newDate;
};
const runHttpRequest = (date) => {
// 此处编写实际的API请求，使用date作为参数
// 例如：
axios.get('/api/data', { params: { date: date } })
.then(response => {
// 处理API响应
console.log(response.data);
})
.catch(error => {
// 处理错误
console.error(error);
});
};
runHandler(); // 启动定时任务
这段代码定义了runHandler函数，使用setInterval每分钟执行一次。 它获取当前时间，判断小时数，并调用formatDate函数格式化日期（建议使用moment.js等库简化日期操作）。 addDays函数计算次日日期。 runHttpRequest函数执行实际的API调用，使用格式化后的日期作为参数。 最后，调用runHandler()启动定时任务。
立即学习“前端免费学习笔记（深入）”；
请根据实际项目需求修改和完善代码，例如添加错误处理、调整定时器间隔等。 务必替换/api/data为你的实际API地址，并根据API规范调整请求方法和参数。 记得安装moment.js: npm install moment
