uni-datetime-picker在uni-app微信小程序中使用范围选择模式设置了end后在ios手机上回调的日期有问题
uni-datetime-picker在uni-app微信小程序中使用范围选择模式设置了end后在ios手机上回调的日期有问题
示例代码：
<uni-datetime-picker :isTime="false" @change="change" ref="datetimePicker" :value="value" type="daterange" end="2025-02-12"
rangeSeparator="至" />
操作步骤：
- end参数设置了2025-02-12，在选择器中选择 2025-02-04 - 2025-02-06
预期结果：
- 返回的数据应为：2025-02-04 - 2025-02-06
实际结果：
- 实际返回的是：2025-02-12 - 2025-02-12
bug描述：
uni-datetime-picker在微信小程序中使用范围选择模式，设置了end后，在ios手机上回调的日期只显示当天的，
举例：end参数设置了2025-02-12，在选择器中选择了 2025-02-04 - 2025-02-06，返回的数据是2025-02-12 - 2025-02-12
经过分析，问题出在了 uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue文件的confirmRangeChange函数中，在该函数中的if判断中，
${this.tempRange.startDate} ${this.tempRange.startTime}，尾部有空字符串，导致ios识别错误
| 项目属性 | 值 |
|---|---|
| 产品分类 | uniapp/小程序/微信 |
| PC开发环境操作系统 | Windows |
| PC开发环境操作系统版本号 | windows 10 |
| HBuilderX类型 | 正式 |
| HBuilderX版本号 | 4.45 |
| 第三方开发者工具版本号 | 1.06.2412050 Stable |
| 基础库版本号 | 3.7.6 |
| 项目创建方式 | HBuilderX |
更多关于uni-datetime-picker在uni-app微信小程序中使用范围选择模式设置了end后在ios手机上回调的日期有问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html
9 回复
你好，我这里测试着没有复现这个问题，你能给一下完整的测试代码吗？
更多关于uni-datetime-picker在uni-app微信小程序中使用范围选择模式设置了end后在ios手机上回调的日期有问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html
<template>
<view class="device-status">
<view class="cont-box">
<view class="date-cont-box">
<view class="date-cont position-relative" @click.stop="openDatetimePicker">
<view class="item-box">
<view class="">
<text v-if="value[0]" style="color: #000;">{{value[0]}}</text>
<text v-else>选择开始日期</text>
</view>
</view>
<view class="wire-box">
</view>
<view class="item-box">
<view class="">
<text v-if="value[1]" style="color: #000;">{{value[1]}}</text>
<text v-else>选择结束日期</text>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="example-body " style="top: -100%;position: absolute;">
<uni-datetime-picker :isTime="false" @change="change" ref="datetimePicker" :value="value" type="daterange" :end="startBefore"
rangeSeparator="至" />
</view>
</view>
这是一个已知的uni-datetime-picker组件在iOS设备上的兼容性问题。问题确实出在confirmRangeChange函数中对日期字符串的处理上。
在iOS系统中，当日期字符串尾部包含空格时，会导致日期解析异常。建议的临时解决方案是：
- 在组件的confirmRangeChange函数中，修改日期字符串拼接方式，确保去掉尾部空格：
`${this.tempRange.startDate}${this.tempRange.startTime ? ' '+this.tempRange.startTime : ''}`
- 或者可以在change事件回调中自行处理返回的日期值：
change(e) {
if (Array.isArray(e)) {
e = e.map(date => date.trim())
}
// 处理逻辑
}