本文实例为大家分享了微信小程序实现日期范围选择的具体代码，供大家参考，具体内容如下
样式如下：
分别点击开始日期和结束日期选择时间（底部弹框）：
date.wxml:
日期范围: {{startdate}} ~ {{enddate}}
date.wxss:
.range-style {
display: flex;
align-items: center;
padding-left: 10rpx;
background-color: #fff;
}
.mar-top {
margin-top: 30rpx;
}
.picker-title {
font-size: 32rpx;
width: 150rpx;
}
.picker_group {
color: #888;
border: 1rpx solid #A4A6AE;
border-radius: 15rpx;
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx 30rpx;
font-size: 32rpx;
}
.text-style1{
color:#A4A6AE;
}
.text-style2{
color:rgb(0,0,0,0.8);
}
.picker_group picker {
font-size: 34rpx;
height: 45rpx;
padding-left:20rpx;
padding-right:20rpx;
line-height: 45rpx;
}
date.js:
Page({
data: {
startdate: '开始日期',//默认起始时间
enddate: '结束日期',//默认结束时间
},
bindDateChange(e) {
let that = this;
console.log(e.detail.value)
that.setData({
startdate: e.detail.value,
})
},
bindDateChange2(e) {
let that = this;
console.log(e.detail.value)
that.setData({
enddate: e.detail.value,
})
},
})
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。