uni-app picker date 组件2021年最后几个日期无法选择

uni-app picker date 组件2021年最后几个日期无法选择

开发环境 版本号 项目创建方式
Windows 19042.1415 HBuilderX
HBuilderX 3.2.16
Chrome 96.0.4664.110

操作步骤：

  • 结束日期设置为2022-01-02，开始日期设置为2021-12-24

预期结果：

  • 2021-12-24到2022-01-2之间的日期都可以选择

实际结果：

  • 2021-12-28、2021-12-29、2021-12-30、2021-12-31四个日期不能选择，会直接跳到2022-01-02

bug描述：

<picker mode="date" start="2021-12-24" end="2022-01-02">  
       <view>2021-12-24</view>  
</picker>

结束日期设置2022-01-02，无论开始日期设置成什么，都无法选择2021年12月的28/29/30/31四个日期


更多关于uni-app picker date 组件2021年最后几个日期无法选择的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

用示例hello uni-app调整开始结束日期，测试并未复现此问题。

更多关于uni-app picker date 组件2021年最后几个日期无法选择的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我本地项目还是存在这个问题，我刚刚将HbuilderX版本更新到了3.3.3，问题还是存在

这个问题是由于 uni-app 的 picker date 组件在处理跨年日期范围时存在的一个已知 bug。具体原因是组件内部在计算日期范围时，对年份边界的处理逻辑有缺陷。

问题分析： 当结束日期设置为2022年，开始日期设置为2021年时，组件在生成可选日期列表时，错误地跳过了2021年12月的最后几天。这通常是因为日期计算中月份/年份的进位逻辑没有正确处理跨年场景。

临时解决方案：

  1. 使用范围选择器替代：

    <picker mode="date" :start="startDate" :end="endDate" [@change](/user/change)="dateChange">

    通过动态计算开始和结束日期来避免这个bug。

  2. 手动处理日期选择：

    // 在change事件中手动验证日期
dateChange(e) {
  const selected = new Date(e.detail.value)
  const start = new Date('2021-12-24')
  const end = new Date('2022-01-02')
  
  if (selected >= start && selected <= end) {
    // 正常处理
  } else {
    // 给出提示或自动调整到最近的有效日期
  }
}
回到顶部