mintUI之Datetime picker的使用
Posted yuxiaoge
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了mintUI之Datetime picker的使用相关的知识,希望对你有一定的参考价值。
在网上看了很多帖子,用起来各种问题,至于什么问题我这里就不多说了,两个字头疼,其实很简单的。
废话不多说,直接上代码
<span class="right" @click="selectYear">{{year}}年{{month}}月</span> <mt-datetime-picker v-model="dateValue" type="date" ref="datePicker" year-format="{value} 年" month-format="{value} 月" date-format="{value} 日" :endDate="new Date()" @confirm="handleConfirm"> </mt-datetime-picker>
1、span标签内有一个selectYear事件就是调用时间组件的,至于后面的年月是我要显示的时间
下面请看js代码,由于我的需求是只显示年月,所以和官网上的有些不一样,我这里做了处理,如果需要显示日,删除相应代码就好了
data () { return { dateValue:‘‘, year:‘2019‘, month:‘10‘ } }, methods: { selectYear () { this.$refs.datePicker.open(); var pickerSlot = document.getElementsByClassName(‘picker-slot‘); pickerSlot[2].style.display = ‘none‘ }, handleConfirm (value) { this.year = value.getFullYear(); this.month = value.getMonth() + 1; this.date = value.getDate(); }, }
以上就是这个插件的代码,如果使用有什么问题,请联系博主
博主看到会回复的(博主qq:1432208663)
以上是关于mintUI之Datetime picker的使用的主要内容,如果未能解决你的问题,请参考以下文章
如何在单个文件组件中使用 vue-datetime-picker
使用 datetime-picker AngularJs 计算所选日期和当前日期之间的天数
AngularJS Bootstrap dateTime-picker 日期格式 dd.MM.yyyy
智能表:使用带有 AngularJs 的 Bootstrap Datetime-Picker 作为过滤器