微信小程序當(dāng)前時(shí)間時(shí)段選擇器插件使用方法詳解
本文實(shí)例為大家分享了微信小程序當(dāng)前時(shí)間時(shí)段選擇器的實(shí)現(xiàn)代碼,供大家參考,具體內(nèi)容如下
DEMO效果圖

插件思路
準(zhǔn)備工作
- 獲取當(dāng)前時(shí)間,同時(shí)獲取當(dāng)前的年、月、日、周幾;
- 創(chuàng)建處理日期數(shù)字的函數(shù);
- 創(chuàng)建格式化日期的函數(shù);
- 創(chuàng)建獲取某月天數(shù)的函數(shù);
- 創(chuàng)建獲取季度開(kāi)始的月份函數(shù)。
獲取時(shí)段
- 創(chuàng)建獲取當(dāng)天的時(shí)段函數(shù);
- 創(chuàng)建獲取本周的時(shí)段函數(shù);
- 創(chuàng)建獲取本月的時(shí)段函數(shù);
- 創(chuàng)建獲取本季度的時(shí)段函數(shù);
- 創(chuàng)建獲取本年的時(shí)段函數(shù);
- 創(chuàng)建自定義時(shí)段函數(shù)。
準(zhǔn)備階段的JS
constructor() {
this.now = new Date();
this.nowYear = this.now.getYear(); //當(dāng)前年
this.nowMonth = this.now.getMonth(); //當(dāng)前月
this.nowDay = this.now.getDate(); //當(dāng)前日
this.nowDayOfWeek = this.now.getDay(); //今天是本周的第幾天
this.nowYear += (this.nowYear < 2000) ? 1900 : 0;
}
//格式化數(shù)字
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('-');
}
//獲取某月的天數(shù)
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;
}
//獲取本季度的開(kāi)始月份
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;
}
時(shí)段函數(shù)JS
//獲取今天的日期
getNowDate() {
return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay));
}
//獲取本周的開(kāi)始日期
getWeekStartDate() {
return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay - this.nowDayOfWeek + 1));
}
//獲取本周的結(jié)束日期
getWeekEndDate() {
return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay + (6 - this.nowDayOfWeek + 1)));
}
//獲取本月的開(kāi)始日期
getMonthStartDate() {
return this.formatDate(new Date(this.nowYear, this.nowMonth, 1));
}
//獲取本月的結(jié)束日期
getMonthEndDate() {
return this.formatDate(new Date(this.nowYear, this.nowMonth, this.getMonthDays(this.nowMonth)));
}
//獲取本季度的開(kāi)始日期
getQuarterStartDate() {
return this.formatDate(new Date(this.nowYear, this.getQuarterStartMonth(), 1));
}
//獲取本季度的結(jié)束日期
getQuarterEndDate() {
return this.formatDate(new Date(this.nowYear, this.getQuarterStartMonth() + 2, this.getMonthDays(this.getQuarterStartMonth() + 2)));
}
//獲取本年的開(kāi)始日期
getYearStartDate() {
return this.formatDate(new Date(this.nowYear, 0, 1));
}
//獲取本年的結(jié)束日期
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(); //獲取本年的結(jié)束日期 let end = this.time.getYearEndDate();
項(xiàng)目地址
git clone git@github.com:Rattenking/GetPeriod.git
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
基于JavaScript實(shí)現(xiàn)彈出框效果
彈出框在網(wǎng)站頁(yè)面中是必不可少的一部分,今天借助腳本之家平臺(tái)給大家分享使用js實(shí)現(xiàn)簡(jiǎn)單的彈出框效果,感興趣的朋友一起學(xué)習(xí)吧2016-02-02
echarts學(xué)習(xí)之legend點(diǎn)擊事件解讀
這篇文章主要介紹了echarts學(xué)習(xí)之legend點(diǎn)擊事件解讀,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-03-03
ie中js創(chuàng)建checkbox默認(rèn)選中問(wèn)題探討
js創(chuàng)建checkbox默認(rèn)選中在某些特殊情況下還是比較實(shí)用的,下面有個(gè)不錯(cuò)的示例,大家可以參考下2013-10-10
理解JavaScript中window對(duì)象的一些用途
這篇文章主要介紹了理解JavaScript中的window對(duì)象,本文通過(guò)實(shí)例代碼詳細(xì)介紹Window對(duì)象的一些重要用途,需要的朋友可以參考下2022-07-07
JAVA Web實(shí)時(shí)消息后臺(tái)服務(wù)器推送技術(shù)---GoEasy
本篇文章主要介紹了PHP實(shí)現(xiàn)Web實(shí)時(shí)消息后臺(tái)服務(wù)器推送技術(shù),這里整理了詳細(xì)的代碼,有需要的小伙伴可以參考下。2016-11-11

