DatePicker 日期选择
文档地址: https://vant-contrib.gitee.io/vant/#/zh-CN/date-picker
组件为 DatePicker
, 常常与 Popup
一起使用.
常用属性:
v-modal
数据绑定用. 数据形为:['year', 'month', 'day']
, 是string[]
类型.min-date
和max-date
作为日期范围. 使用Date
数据类型.title
标题- 选项类型
columns-type
, 任意组合 年月日的选择方式, 取值类型为('year'|'month'|'day')[]
- 格式选项:
formatter
函数. 为每一个选项调用, 利用该函数可以自定义显示的内容. - 过滤选项:
filter
函数. 每一个选项也会调用该函数, 返回true
才会在页面中显示.
常用事件:
confirm
点击确认时触发cancel
点击取消时触发
使用语法:
<van-date-picker v-model="..."></van-date-picker>
注意在 iOS 设备上, 不支持
new Date('2020-1-1')
的写法, 应使用new Date(2020/1/1)
的形式.
如果不使用弹框, 直接在页面中使用, 效果如下:
应该结合 Popup
使用