vant-weapp dateTime-picker中快速选择一个日期,有时会回滚到上一个日期,导致交互上有点奇怪

vmpqdwk3  于 2023-03-19  发布在  Vant
关注(0)|答案(2)|浏览(432)

具体描述请看以下代码片段注释:

updateColumnValue: function (value) {
            var _this = this;
            var values = [];
            var type = this.data.type;
            var formatter = this.data.formatter || defaultFormatter;
            var picker = this.getPicker();
            if (type === 'time') {
                var pair = value.split(':');
                values = [formatter('hour', pair[0]), formatter('minute', pair[1])];
            }
            else {
                var date = new Date(value);
                values = [
                    formatter('year', "".concat(date.getFullYear())),
                    formatter('month', padZero(date.getMonth() + 1)),
                ];
                if (type === 'date') {
                    values.push(formatter('day', padZero(date.getDate())));
                }
                if (type === 'datetime') {
                    values.push(formatter('day', padZero(date.getDate())), formatter('hour', padZero(date.getHours())), formatter('minute', padZero(date.getMinutes())));
                }
            }

            // ******这边返回一个promise,处理完两个then再返回,那么原来的updateCollumns会在onChange之前调用,实际上onChange的时候不需要再updateColumns(),因为已经初始化的时候已经更新过了列的数据,会造成用户选择有时会回滚到上一个选择的日期或者别的日期
            return this.set({ innerValue: value })
                .then(function () { return _this.updateColumns(); })
                .then(function () { return picker.setValues(values); });
        },
    },
n6lpvg4x

n6lpvg4x1#

@lanhuibenz 官方组件代码有点问题,滚动会有上谈到之前动画未完成的情况,设置value会有这情况,我没有用到过bind:input或change,但修改官方代码为this.set({innervalue:value}).then(()=> _this.updateColumns(); picker.setValues(values));亲测有效,但我没有测试过 bind:input会如何; 自己拉一下官方的date-picker组件自行修改二次封装即可使用

uoifb46i

uoifb46i2#

@lanhuibenz 而且该问题只出现在android手机,ios没有问题

相关问题