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

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

sauo3年前 (2022-12-15)电脑知识92

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如何实现点击时间获取时间段查询功能,” 的相关文章

硬核推荐(ubuntu取消自动休眠)ubuntu关闭自动休眠命令,ubuntu 关闭自动休眠模式的方法,ubuntu 关闭自动休眠模式的方法,

硬核推荐(ubuntu取消自动休眠)ubuntu关闭自动休眠命令,ubuntu 关闭自动休眠模式的方法,ubuntu 关闭自动休眠模式的方法,

免费领取腾讯云服务器! 在使用ssh连接ubuntu系统时,发现长时间不输入ssh命令ssh就会自动断开。查找了一下原因,发现是安装ubuntu的电脑自动进入了休眠模式,而ubuntu系统中有多种关闭自动休眠的方法,下面就来说一说使用ssh命令来关闭ubu...

全程干货(查看php是否启动)查看php是否支持rar解压,查看php是ts版本还是nts版本的方法,查看php是ts版本还是nts版本的方法,

全程干货(查看php是否启动)查看php是否支持rar解压,查看php是ts版本还是nts版本的方法,查看php是ts版本还是nts版本的方法,

免费领取腾讯云服务器! 今天有用户来询问php的ts版本与php的nts版本的区别是什么,怎么去查看自己安装的php服务是ts版本还是nts版本,下面博文就来详细的说一下。 php ts版本与nts版本的区别 php官方提供...

不看后悔(php全局变量有哪些)php全局变量和局部变量的区别,php全局变量与js全局变量的区别,php全局变量与js全局变量的区别,

免费领取腾讯云服务器! 因为经常写php与js代码,有时候使用全局变量的时候经常的混淆,这篇文章就来说说js中的全局变量与php中的全局变量的区别。 js全局变量与php全局变量的区别 php全局变量 php...

没想到(PHP重定向)php获取重定向后的地址,php实现页面重定向的方法,php实现页面重定向的方法,

免费领取腾讯云服务器! php脚本实现页面重定向有多种方法,下面列几种简单的方法,供大家来参考一下。 php实现页面重定向的方法 方法1: 使用php中的 header() 函数来实现页面的跳转,实现重定向的...

速看(js将图片转换为二进制流)js将图片转换为webp,js将图片转换为base64编码方法,js将图片转换为base64编码方法,

免费领取腾讯云服务器! js可以将图片文件转成base64编码的,便于图片文件的上传与处理,下面就写几种关于js脚本来转换图片为base64编码的方法。 js将图片转换为base64编码的方法 方法1 将自身...

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

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

发表评论

访客

看不清,换一张

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