1.查看Vant官网https://youzan.github.io/vant/#/zh-CN/datetime-picker
引入Vant中DatetimePicker组件(全局引入后可直接使用)
import Vue from \'vue\'; import { DatetimePicker } from \'vant\' Vue.use(DatetimePicker);
关键使用代码(结合vant组件Popup的底部弹出层一起使用)
<van-popup v-model=\"dateShow\" position=\"bottom\"> <van-datetime-picker v-model=\"currentDate\" type=\"year-month\" @cancel=\"handleCancel\" @confirm=\"handleEndDateConfirm\" /> </van-popup> export default { data() { return { dateShow: false, currentDate: new Date() }; } }
效果图
实现点击确定 和取消的方法
handleCancel () { this.dateShow = false; }, //开始时间 handleEndDateConfirm () { this.dateShow = false; this.titleTime = dateFormat(this.currentDate, \'yyyy-MM\') },
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
© 版权声明
THE END
暂无评论内容