小程序中轻松添加日期和时间的选择

2021/10/7 14:10:52

本文主要是介绍小程序中轻松添加日期和时间的选择,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

介绍

选择日期和时间,直接使用小程序的默认组件picker,就可以解决了。

选择日期:将mode设置为date

选择事件:将mode设置为time

注意:date和data经常容易被弄混,这里我特别强调一下。在表示日期的时候,使用的是date,在表示数据/资料的时候,使用的是data。比如说,如果我们要用时间,肯定是datetime,如果要获取数据,肯定是e.target.data,这里记住了,以后就不会纠结于为什么一会date,一会data了

日期选择器

mode 必须设置为date

value 默认值为当天,注意,并非是真实时间,是用户的本地时间,格式为YYYY-MM-DD

start 日期的开始范围,如果不设置,默认会到公元元年,格式为YYYY-MM-DD

end 日期的结束范围,如果不设置,默认会到10000年,格式为YYYY-MM-DD

fields 选择器粒度(这是官方的说法,实际上就是设置日期的精确度)

1,year,如果设置为year,那么,就不用选择月和日了,只需要选择年份。

2,month,如果设置为month,那么,就不用选择日了,只需要选择年和月。

3,day,完全没用,默认值就是day,如果你要写day,不如整个都不写

bindchange 绑定变化事件

注意:YYYY-MM-DD的意思是,写成2021-10-07这样的格式。其中Y代表年份,M代表月份,D代表天,写几个字母,就表示这个要用几个数字来表示。比如说,你见到了MM/DD/YY这种格式,那么就是10/07/21。 

绑定变化事件得到数据,依然是常规的使用e.detail.value,这个就不再重复,得到的结果是YYYY-MM-DD的字符串。

如果使用的fields是month,那么结果是YYYY-MM。

如果使用的fields是year,那么结果是YYYY。

时间选择器

mode 必须设置为time

value 设置选中的值,格式为hh:mm

start 设置起始时间范围,不设置则为00:00,格式为hh:mm

end 设置结束时间范围,不设置则为23:59,格式为hh:mm

bindchange 绑定变化事件

同样,通过e.detail.value,可以获得格式为hh:mm的选择值



这篇关于小程序中轻松添加日期和时间的选择的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程