当前位置:首页 > 电脑知识 > 正文内容

干货分享(vue中获取当前时间)vue时间戳,Vue如何实现点击时间获取时间段查询功能,Vue如何实现点击时间获取时间段查询功能,

sauo2年前 (2022-12-15)电脑知识49

Vue如何实现点击时间获取时间段查询功能废话不多说,直接上代码。

html:

<template><divclass="personalReport_time"><inputtype="date":max="this.endTime"value=""v-model="startTime"/><div></div><inputtype="date":min="startTime":max="this.maxTime"v-model="endTime"/></div><ulclass="personalReport_date"><li@click="query(today)">今天</li><li@click="query(yesterday)">昨天</li><li@click="query(weeks)">本周</li><li@click="query(lastWeek)">上周</li><li@click="query(month)">本月</li><li@click="query(lastMonth)">上月</li></ul><div><button@click="query"class="but">查询</button></div></template>

vue.js点击事件代码:

//获取时间、//时间解析;Time:function(now){let year=newDate(now).getFullYear();let month=newDate(now).getMonth()+1;let date=newDate(now).getDate();if(month <10) month ="0"+ month;if(date <10) date ="0"+ date;return year+"-"+month+"-"+date },//本周第一天; showWeekFirstDay:function(){letNowdate=newDate();letWeekFirstDay=newDate(Nowdate-(Nowdate.getDay()-1)*86400000);letM=Number(WeekFirstDay.getMonth())+1;if(M<10){M="0"+M;}letD=WeekFirstDay.getDate();if(D<10){D="0"+D;}returnWeekFirstDay.getFullYear()+"-"+M+"-"+D;},//本周最后一天 showWeekLastDay:function(){letNowdate=newDate();letWeekFirstDay=newDate(Nowdate-(Nowdate.getDay()-1)*86400000);letWeekLastDay=newDate((WeekFirstDay/1000+6*86400)*1000);letM=Number(WeekLastDay.getMonth())+1;if(M<10){M="0"+M;}letD=WeekLastDay.getDate();if(D<10){D="0"+D;}returnWeekLastDay.getFullYear()+"-"+M+"-"+D;},//获得某月的天数: getMonthDays:function(myMonth){let monthStartDate =newDate(newDate().getFullYear(), myMonth,1);let monthEndDate =newDate(newDate().getFullYear(), myMonth +1,1);let days =(monthEndDate - monthStartDate)/(1000*60*60*24);return days;},//点击事件 query:function(way){let self=this;this.$refs.pag.currentPage=1;this.page=this.$refs.pag.currentPage;switch(way){casetoday:this.startTime=this.maxTime;this.endTime=this.maxTime;break;caseyesterday:this.startTime=this.Time(newDate().getTime()-24*60*60*1000);this.endTime=this.Time(newDate().getTime()-24*60*60*1000);break;caseweeks:this.startTime=this.showWeekFirstDay();this.endTime=this.maxTime;break;caselastWeek:this.startTime=this.Time(newDate(newDate().getFullYear(),newDate().getMonth(),newDate().getDate()-newDate().getDay()-6));this.endTime=this.Time(newDate(newDate().getFullYear(),newDate().getMonth(),newDate().getDate()+(6-newDate().getDay()-6)));break;casemonth:this.startTime=this.Time(newDate(newDate().getFullYear(),newDate().getMonth(),1));this.endTime=this.maxTime;break;caselastMonth:this.startTime=this.Time(newDate(newDate().getFullYear(),newDate().getMonth()-1,1));this.endTime=this.Time(newDate(newDate().getFullYear(),newDate().getMonth()-1,this.getMonthDays(newDate().getMonth()-1)));break;}this.$axios({ method:post, url:/inter/user/queryMemberReport, data:{account:this.account,baseLotteryId:this.lottersId,startTime:this.startTime,endTime:this.endTime }}).then(function(data){// console.log(data)}).catch(function(error){ console.log(error);})}

这样一个点击查询时间段效果就可以实现了。希望能够帮助到大家。

(window.slotbydup = window.slotbydup || []).push({ id: "u6835052", container: "_96bek913mdb", async: true });

本文链接:http://blog.sauo.top/?id=523 感谢分享!

分享到:

扫描二维码推送至手机访问。

版权声明:本文由冬眠先生个人博客发布,如需转载请注明出处。

本文链接:http://blog.sauo.top/?id=523

分享给朋友:

“干货分享(vue中获取当前时间)vue时间戳,Vue如何实现点击时间获取时间段查询功能,Vue如何实现点击时间获取时间段查询功能,” 的相关文章

这都可以(PHP百度百科)pHp是什么,php中关于strtotime函数31日取前几个月日期的BUG,php中关于strtotime函数31日取前几个月日期的BUG,

免费领取腾讯云服务器! 在使用php脚本中的 strtotime 函数取前几个月的日期时,发现每到31日时,取出的前几个月的日期都会出现错误。仔细检查了一下,发现在利用 strtotime 函数取前几个月的日期时,给 strtotime 函数的参数并不规范...

这都可以?(常用正则表达式大全)常用正则表达式大全图片,常用正则表达式大全,常用正则表达式大全,

免费领取腾讯云服务器! 网上收集了一些常用的正则表达式,基本上都全,需要的可以拿去了。 关于号码的正则表达式 QQ号正则表达式 BASIC /^[1-9][0-9]{...

难以置信(php错误日志在哪里)PHP 日志,php设置错误日志的方法,php设置错误日志的方法,

难以置信(php错误日志在哪里)PHP 日志,php设置错误日志的方法,php设置错误日志的方法,

免费领取腾讯云服务器! php设置错误日志需要在php配置文件php.ini中设置,只需要简单的几步设置就可以实现,下面就来详细的说一下。 php设置错误日志的方法 1、打开php的配置文件,php.ini...

不要告诉别人(php求数组交集)php数组取差集,php计算两个数组的交集与差集,php计算两个数组的交集与差集,

免费领取腾讯云服务器! php中计算两个数组之间的交集与差集可以使用 array_intersect() 与 array_diff() 数组处理函数,这两个数组的具体使用方法如下。 php计算两个数组之间的交集 array_...

没想到(imagettftext函数)imagettftext函数支持的编码类型,imagettftext(): any2eucjp(): invalid code in input string 错误解决方法,imagettftext(): any2eucjp(): invalid code in input string 错误解决方法,

免费领取腾讯云服务器! 最近在研究关于php生成图片的东西,发现了 imagettftext() 函数中一个不是错误的错误,具体的错误情况如下所示。 错误代码:...

这都可以(php获取当前时间)php获取月份,php获取上个月,上上个月的开始时间与结束时间的方法,php获取上个月,上上个月的开始时间与结束时间的方法,

免费领取腾讯云服务器! 记录一下利用php脚本获取上个月,上上个月的开始时间与结束时间的方法,下面的示例代码,有需要的可以参考一下。 php 获取上个月,上上个月的开始时...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。