小见
小见
  • 发布:2021-01-06 15:39
  • 更新:2021-01-07 10:09
  • 阅读:581

【报Bug】picker mode="date" 限定范围日期滚动日期错乱

分类:uni-app

产品分类: uniapp/H5

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 18363.1256

HBuilderX类型: 正式

HBuilderX版本号: 3.0.4

浏览器平台: Chrome

浏览器版本: 86.0.4240.111(正式版本) (32 位)

项目创建方式: HBuilderX

示例代码:
<template>  
    <view class="content">  
        <view class="uni-title uni-common-pl">日期选择器</view>  
        <view class="uni-list">  
            <view class="uni-list-cell">  
                <view class="uni-list-cell-db">  
                    <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">  
                        <view class="uni-input">{{date}}</view>  
                    </picker>  
                </view>  
            </view>  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            const currentDate = this.getDate(0)  
            return {  
                title: 'Hello',  
                date: currentDate,  
            }  
        },  
        computed: {  
            startDate() {  
                console.log(this.getDate(-7))  
                return this.getDate(-7);  
            },  
            endDate() {  
                console.log(this.getDate(0))  
                return this.getDate(0);  
            }  
        },  
        methods: {  
            getDate(day) {  
                let today = new Date();  
                let targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;  
                today.setTime(targetday_milliseconds);  
                let tYear = today.getFullYear();  
                let tMonth = today.getMonth();  
                let tDate = today.getDate();  
                tMonth = this.doHandleMonth(tMonth + 1);  
                tDate = this.doHandleMonth(tDate);  
                return tYear + "-" + tMonth + "-" + tDate;  
            },  
            doHandleMonth(month) {  
                let m = month;  
                if (month.toString().length == 1) {  
                    m = "0" + month;  
                }  
                return m;  
            },  
            /**  
             * 选择日期  
             */  
            bindDateChange: function(e) {  
                console.log("选择", e.target.value);  
                this.date = e.target.value  
            },  
        }  
    }  
</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200rpx;  
        width: 200rpx;  
        margin-top: 200rpx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50rpx;  
    }  

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

    .title {  
        font-size: 36rpx;  
        color: #8f8f94;  
    }  
</style>  

操作步骤:

日期选择范围2020-12-30到2021-01-06 100%复现

预期结果:

可正常滚动 选择范围内的日期

实际结果:

滑动到2021年1月4号-1号范围 -- 会自动跳转到2020年12月30日

bug描述:

picker日期
限定7天范围,例:2020-12-30 到 2021-01-06 范围
滑动到2021年1月4号-1号范围 -- 会自动跳转到2020年12月30日

2021-01-06 15:39 负责人:无 分享
已邀请:
DCloud_UNI_Anne

DCloud_UNI_Anne

问题已验证,后续修复,已加分,感谢您的反馈!

小见

小见 (作者)

新年bug

[已删除]

[已删除]

承接H5、小程序、APP等外包:

  1. 经验丰富,做过多种类型项目,有案例可看;
  2. 整个项目外包可以找我(小团队接单,面向客户、产品);
  3. 只需要前端部分也可以找我(个人接单,面向服务端合作伙伴);
  4. wechat(13070273424);

该问题目前已经被锁定, 无法添加新回复