当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 微信小程序当前时间时段选择器插件使用方法详解

微信小程序当前时间时段选择器插件使用方法详解

2019年01月07日  | 移动技术网IT编程  | 我要评论

本文实例为大家分享了微信小程序当前时间时段选择器的实现代码，供大家参考，具体内容如下

demo效果图

插件思路

准备工作

  1. 获取当前时间，同时获取当前的年、月、日、周几；
  2. 创建处理日期数字的函数；
  3. 创建格式化日期的函数；
  4. 创建获取某月天数的函数；
  5. 创建获取季度开始的月份函数。

获取时段

  1. 创建获取当天的时段函数；
  2. 创建获取本周的时段函数；
  3. 创建获取本月的时段函数；
  4. 创建获取本季度的时段函数；
  5. 创建获取本年的时段函数；
  6. 创建自定义时段函数。

准备阶段的js

constructor() {
 this.now = new date();
 this.nowyear = this.now.getyear(); //当前年 
 this.nowmonth = this.now.getmonth(); //当前月 
 this.nowday = this.now.getdate(); //当前日 
 this.nowdayofweek = this.now.getday(); //今天是本周的第几天 
 this.nowyear += (this.nowyear < 2000) ? 1900 : 0;
}
//格式化数字
formatnumber(n) {
 n = n.tostring()
 return n[1] ? n : '0' + n
}
//格式化日期
formatdate(date) {
 let myyear = date.getfullyear();
 let mymonth = date.getmonth() + 1;
 let myweekday = date.getdate();
 return [myyear, mymonth, myweekday].map(this.formatnumber).join('-');
}
//获取某月的天数
getmonthdays(mymonth) {
 let monthstartdate = new date(this.nowyear, mymonth, 1);
 let monthenddate = new date(this.nowyear, mymonth + 1, 1);
 let days = (monthenddate - monthstartdate) / (1000 * 60 * 60 * 24);
 return days;
}
//获取本季度的开始月份
getquarterstartmonth() {
 let startmonth = 0;
 if (this.nowmonth < 3) {
  startmonth = 0;
 }
 if (2 < this.nowmonth && this.nowmonth < 6) {
  startmonth = 3;
 }
 if (5 < this.nowmonth && this.nowmonth < 9) {
  startmonth = 6;
 }
 if (this.nowmonth > 8) {
  startmonth = 9;
 }
 return startmonth;
}

时段函数js

//获取今天的日期
 getnowdate() {
 return this.formatdate(new date(this.nowyear, this.nowmonth, this.nowday));
 }
 //获取本周的开始日期
 getweekstartdate() {
 return this.formatdate(new date(this.nowyear, this.nowmonth, this.nowday - this.nowdayofweek + 1));
 }
 //获取本周的结束日期
 getweekenddate() {
 return this.formatdate(new date(this.nowyear, this.nowmonth, this.nowday + (6 - this.nowdayofweek + 1)));
 }
 //获取本月的开始日期
 getmonthstartdate() {
 return this.formatdate(new date(this.nowyear, this.nowmonth, 1));
 }
 //获取本月的结束日期
 getmonthenddate() {
 return this.formatdate(new date(this.nowyear, this.nowmonth, this.getmonthdays(this.nowmonth)));
 }
 //获取本季度的开始日期
 getquarterstartdate() {
 return this.formatdate(new date(this.nowyear, this.getquarterstartmonth(), 1));
 }
 //获取本季度的结束日期 
 getquarterenddate() {
 return this.formatdate(new date(this.nowyear, this.getquarterstartmonth() + 2, this.getmonthdays(this.getquarterstartmonth() + 2)));
 }
 //获取本年的开始日期
 getyearstartdate() {
 return this.formatdate(new date(this.nowyear, 0, 1));
 }
 //获取本年的结束日期
 getyearenddate() {
 return this.formatdate(new date(this.nowyear, 11, 31));
 }

使用方法

1.引入getperiod.js

const getperiod = require("../../utils/getperiod.js");

2.使用getperiod.js

this.time = new getperiod();

//获取本年的结束日期
let end = this.time.getyearenddate();

项目地址

微信小程序—-时段选取插件

git clone git@github.com:rattenking/getperiod.git

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网