更新记录

1.0.2（2023-09-28）

增加：1、判断两个日期是否相差x个月； 2、判断两个日期是否相差x天 （使用场景：用于查询数据时日期范围筛选限制，提高查询性能）

1.0.1（2023-09-27）

1、增加来获取本月第一天的日期 、获取本月最后一天的日期 2、修正了getData拼写错误

1.0.0（2023-09-01）

常用工具集合，后期上npm

查看更多

平台兼容性

Vue2 Vue3
√ √
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 app-vue app-nvue √ √ √ √ √ √
钉钉小程序 快手小程序 飞书小程序 京东小程序
√ √ √ √
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
√ √ √ √ √ √ √ √ √

常用日期工具集合

序号
说明
 方法名 参数 返回值示例
1 获取当前日期 getToday seperator：分隔符，不必填，默认- 2023-09-01
2 获取当前日期时间 getTodayTime seperator：分隔符，不必填，默认- 2023-09-01 16:25:55
3 获取星期几 getWeekDay dateStr：日期字符串，不必填，默认取今天 星期五
4 获取时间戳 getCurrentTime - 1693556955694
5 获取昨天 getYesterday - 2023-08-31
6 获取明天 getTomorrow - 2023-09-02
7 获取几天前/几天后的日期 getDate day：前后加减的天数（类型为正整数和负整数）；seperator：分隔符，不必填，默认- 2023-09-10
8 获取最近七天的日期(默认倒序) getLast7Day orderBy：排序方式（desc：倒序，asc：顺序），不必填，默认desc 见右侧图
9 计算两个日期相隔天数 dateDiff dateStr1,dateStr2：日期字符串，必填 见右侧图
10 计算两个时间差，返回天小时分钟 timeDiff datetimeStr1,datetimeStr2：日期时间字符串，必填 见右侧图
11 获得上周周一和周日的日期 getLastWeekData - 见右侧图
12 获得本周周一和周日的日期 getThisWeekData - 见右侧图
13 时间戳转换为几秒/几分/几小时/几天前 getFriendlyDate timestamp：时间戳，必填 5分钟前
14 获取本月第一天的日期 getThisMonthFirstDay - 2023-09-01
15 获取本月最后一天的日期 getThisMonthLastDay - 2023-09-30
16 判断两个日期是否相差x个月（用于查询时日期范围筛选限制） validateDiffMonths d1,d2,num（d1,d2为比较的两个日期；num不必填，默认为12，代表12个月） true/false
17 判断两个日期是否相差x天（用于查询时日期范围筛选限制） validateDiffDays d1,d2,num（d1,d2为比较的两个日期；num不必填，默认为31，代表31天） true/false

参考代码

<template>
    <view class="content_container">
        <uni-forms ref="baseForm" :modelValue="baseFormData">
            <h2 class="van-doc-demo-block__title">常用日期工具集合</h2>
            <uni-forms-item label="1、获取当前日期">
                <view class="v__value">{{getToday}}</view>
            </uni-forms-item>
            <uni-forms-item label="2、获取当前日期时间">
                <view class="v__value">{{getTodayTime}}</view>
            </uni-forms-item>
            <uni-forms-item label="3、获取今天是星期几">
                <view class="v__value">{{getWeekDay}}</view>
            </uni-forms-item>
            <uni-forms-item label="4、获取时间戳"><view class="v__value">{{getCurrentTime}}</view></uni-forms-item>
            <uni-forms-item label="5、获取昨天"><view class="v__value">{{getYesterday}}</view></uni-forms-item>
            <uni-forms-item label="6、获取昨天是星期几">
                <view class="v__value">{{getYesWeekDay}}</view>
            </uni-forms-item>
            <uni-forms-item label="7、获取明天"><view class="v__value">{{getTomorrow}}</view></uni-forms-item>
            <uni-forms-item label="8、获取5天前"><view class="v__value">{{getDate5s}}</view></uni-forms-item>
            <uni-forms-item label="9、获取10天后"><view class="v__value">{{getDate10p}}</view></uni-forms-item>
            <!-- <uni-forms-item label="8、获取最近七天的日期"><view class="v__value">{{getLast7Day}}</view></uni-forms-item> -->
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                    <text>10、获取最近七天的日期(默认倒序)</text>
                 </view>
                 <view class="v__value">
                    <view v-for="(it, index) in getLast7Day">
                        <view :key="index" style="text-align: right;">{{it}}</view>
                    </view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                    <text>11、获取最近七天的日期(顺序)</text>
                 </view>
                 <view class="v__value">
                    <view v-for="(it, index) in getLast7DayAsc">
                        <view :key="index" style="text-align: right;">{{it}}</view>
                    </view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                     <text>12、计算两个日期相隔天数</text>
                 </view>
                 <view class="v__value">
                    <view style="color:#333;">2023-08-31</view>
                    <view style="color:#333;">与2023-08-01</view>
                    <view>相差：{{getDateDiff}}天</view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                     <text>13、计算两个时间差，返回天小时分钟</text>
                 </view>
                 <view class="v__value">
                    <view style="color:#333;">2022-02-28 10:57:12</view>
                    <view style="color:#333;">与2022-02-18 16:25:40</view>
                    <view>相差：{{getTimeDiff}}</view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                    <text>14、获得上周周一和周日的日期</text>
                 </view>
                 <view class="v__value">
                    <view v-for="(it, index) in getLastWeekData">
                        <view :key="index" style="text-align: right;">{{it}}</view>
                    </view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                    <text>15、获得本周周一和周日的日期</text>
                 </view>
                 <view class="v__value">
                    <view v-for="(it, index) in getThisWeekData">
                        <view :key="index" style="text-align: right;">{{it}}</view>
                    </view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                    <text>16、日期时间转换为几秒/几分/几小时/几天前</text>
                 </view>
                 <view class="v__value">
                     <view style="color:#333;">2023-09-01 21:07:12</view>
                    <view>转换后：{{getFriendlyDate}}</view>
                </view> 
            </view>
            <uni-forms-item label="17、获取本月第一天的日期">
                <view class="v__value">{{getThisMonthFirstDay}}</view>
            </uni-forms-item>
            <uni-forms-item label="18、获取本月最后一天的日期">
                <view class="v__value">{{getThisMonthLastDay}}</view>
            </uni-forms-item>

            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                     <text>19、判断两个日期是否相差x个月（用于查询时日期范围筛选限制）</text>
                 </view>
                 <view class="v__value">
                    <view style="color:#333;">2021-08-01</view>
                    <view style="color:#333;">与2023-08-28</view>
                    <view>查询范围是否超过12个月：{{validateDiffMonths}}</view>
                 </view>
            </view>
            <view class="uni-forms-item is-direction-left" style="display: flex;position: relative;">
                 <view style="width:65px;justify-content:flex-start;" class="uni-forms-item__label">
                     <text>20、判断两个日期是否相差x天（用于查询时日期范围筛选限制）</text>
                 </view>
                 <view class="v__value">
                    <view style="color:#333;">2023-08-01</view>
                    <view style="color:#333;">与2023-09-28</view>
                    <view>查询范围是否超过31天：{{validateDiffDays}}</view>
                 </view>
            </view>
        </uni-forms>
    </view>
</template>
<script>
    import dateUtil from '../util/dateUtil.js'
    export default {
        data() {
            return {

            }
        },
        computed:{
            getToday(){
                return dateUtil.getToday()
            },
            getTodayTime(){
                return dateUtil.getTodayTime()
            },
            getWeekDay(){
                return dateUtil.getWeekDay()
            },
            getCurrentTime(){
                return dateUtil.getCurrentTime()
            },
            getYesterday(){
                return dateUtil.getYesterday()
            },
            getYesWeekDay(){
                return dateUtil.getWeekDay(dateUtil.getYesterday())
            },
            getTomorrow(){
                return dateUtil.getTomorrow()
            },
            getDate5s(){
                return dateUtil.getDate(-5)
            },
            getDate10p(){
                return dateUtil.getDate(10)
            },
            getLast7Day(){
                return dateUtil.getLast7Day()
            },
            getLast7DayAsc(){
                return dateUtil.getLast7Day('asc')
            },
            getDateDiff(){
                return dateUtil.dateDiff('2023-08-31','2023-08-01')
            },
            getTimeDiff(){
                return dateUtil.timeDiff('2022-02-28 10:57:12', '2022-02-18 16:25:40')
            },
            getLastWeekData(){
                return dateUtil.getLastWeekData()
            },
            getThisWeekData(){
                return dateUtil.getThisWeekData()
            },
            getFriendlyDate(){
                var date = new Date('2023-09-01 21:07:12');
                return dateUtil.getFriendlyDate(date.getTime())
            },
            getThisMonthFirstDay(){
                return dateUtil.getThisMonthFirstDay()
            },
            getThisMonthLastDay(){
                return dateUtil.getThisMonthLastDay()
            },
            validateDiffMonths(){
                return dateUtil.validateDiffMonths('2021-08-01','2023-08-28')
            },
            validateDiffDays(){
                return dateUtil.validateDiffDays('2023-08-01','2023-09-28')
            }
        }
    }
</script>
<style lang="scss">
    @import './uni-forms-style.scss';
    /** 引入真实项目时，请将以下样式拷贝到全局样式uni.scss中，不需要每个页面都定义 ----start**/
    view,
    image,
    text {
      box-sizing: border-box;
      flex-shrink: 0;
    }

    #app {
      width: 100vw;
      height: 100vh;
    }

    .flex-row {
      display: flex;
      flex-direction: row;
    }

    .flex-col {
      display: flex;
      flex-direction: column;
    }

    .justify-start {
      display: flex;
      justify-content: flex-start;
    }

    .justify-center {
      display: flex;
      justify-content: center;
    }

    .justify-end {
      display: flex;
      justify-content: flex-end;
    }

    .justify-evenly {
      display: flex;
      justify-content: space-evenly;
    }

    .justify-around {
      display: flex;
      justify-content: space-around;
    }

    .justify-between {
      display: flex;
      justify-content: space-between;
    }

    .items-start {
      display: flex;
      align-items: flex-start;
    }

    .items-center {
      display: flex;
      align-items: center;
    }

    .items-end {
      display: flex;
      align-items: flex-end;
    }
    /** 引入真实项目时，请将以下样式拷贝到全局样式uni.scss中，不需要每个页面都定义 ----end**/
</style>

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论

暂无用户评论。

插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...