更新记录

1.0.0(2023-06-21) 下载此版本

可选择今明后三天的时间选择 时间间隔支持手动修改


平台兼容性

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

基本用法

<view @tap="showDate">显示</view>
<lh-date ref="lhDate" @confirm="newDateConfirm" title="请选择时间" :showDay="3" :isTodayFirstZero="false" :twoIndexTimeInterval="40"></lh-date>
组件参数:
showDay:显示天数 3就表示左侧有今明后三天;2代表今明两天; 1代表今天
isTodayFirstZero:今天的第一个时间的时间戳是否为0(方面某些人的需要)
twoIndexTimeInterval:今天第一个时间和第二个时间的间隔(默认30分钟)
greaterTwoIndexTimeInterval:第二个以上的时间间隔(默认是10分钟)
isCurMinutesCeil:是否将今天当前分钟数上取整,比如00:02->00:10  上取整
activeColor:选中的时间的字体颜色
title:弹窗顶部title

tips:
如果需要一开始自动使用时间则在 onLoad执行 this.$refs.lhDate.initDate(dateInfo, 'auto')
@confirm会自动返回数据
export default {
    data() {
        return {
            // 初始数据
            dateInfo: {
                firstDateText: '立即送达',  // 今天第一个时间用文字替代
                time: 0,    
                leftCurIndex: 0,    // 组件左边区域的索引
                rightCurIndex: 0,   // 组件右边区域的索引
                scrollIntoView: 'index-0',  // 这个是选中时间后  重新选择会自动定位到对应的时间
            }
        }
    },
    methods: {
        showDate(){
            this.$refs.lhDate.show(this.dateInfo)
        },
        newDateConfirm(dateInfo){
            // 请保持this.deteInfo等于deteInfo,方便重新选的时候,传入进去自动定位到上次选择的位置,你可以拿其他变量来保存返回值
            this.dateInfo = dateInfo
        },
    }
}

隐私、权限声明

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

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

插件不采集任何数据”

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

无·

许可协议

MIT协议

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