uview组件中 日期选择器如何重置为默认?

uview组件中 日期选择器如何重置为默认?

最近产品给出一个需求,需要在日期选择器中把取消替换为重置按钮需要把选中的日期也重置,发现uview官网文档并没有这个解决方案。

在这里插入图片描述

想要直接查看最终解决方法,请看底部~~~~~~~~~~~~~~~

为了实现这个需求,首先想到的是去查阅源码,看看是否有解决方法

在这里插入图片描述

发现源码中有init方法,该方法用于初始化操作,会重置选项中的数据。

在这里插入图片描述

首先使用ref去获取u-datetime-picker中的方法及属性,再通过this.$refs.picker.init()去使用

在这里插入图片描述
心里想着这就能解决这个需求了,于是准备收拾收拾准备下班了。

但是 ~~~~

在跑流程时发现选中后月份是可以重置,但是年份需要点击两次才会把选中的数据完全重置成默认初始值。完了心里拔凉拔凉的,那指定下不了班了。看来今天是不能准时下班去打球了。 o(╥﹏╥)o

在这里插入图片描述
于是发扬杠精精神,再去查阅源码,发现init()方法中有调用this.updateColumnValue方法,那么我们看一下如何使用:
在这里插入图片描述

原谅我阅读源码没有仔细看注释 只看到了init 初始化就没有往下阅读

在这里插入图片描述

发现updateColumnValue需要接收一个值通过value去进行重置操作,那么我们需要在调用时传入你想重置为你需要的日期如果不传是不会生效的请注意!!!

在这里插入图片描述
在这里插入图片描述

最后完美解决这个问题,下班下班~~!!!

总结:使用源码中的updateColumnValue方法

this.$refs.picker.updateColumnValue('2013-01')

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值