Using the time plug-in and getting the selection value in mint-ui

Below I will share with you an article on how to use the mint-ui time plug-in and obtain the selected value. It has a good reference value and I hope it will be helpful to everyone.

is as follows:

<p > {{pickerValue}}</p>
<mt-datetime-picker
 ref="picker" 每一个都要填上这一条open
 type="time"
 @confirm="handleConfirm" 设置点击确定
 v-model="pickerValue">
</mt-datetime-picker>
data () {
 return {
 pickerValue:null, 定义
methods:{
openPicker() {
 this.$refs.picker.open();设置开始
 },
handleConfirm(){ console.log(this.pickerValue) ;获取值},

转换小时

formatDate(date) {
 const y = date.getFullYear()
 let m = date.getMonth() + 1
 m = m < 10 ? &#39;0&#39; + m : m
 let d = date.getDate()
 d = d < 10 ? (&#39;0&#39; + d) : d
 return y + &#39; &#39; + m + &#39; &#39; + d
},
handleConfirm(){
 let a = this.pickerValue
 // console.log(a.split(" ")) ;
 this.zheng=this.formatDate(this.$refs.picker.value)
 console.log(this.formatDate(this.$refs.picker.value))
 // console.log(this.value) ;
},

设置当前日期为初始日期

<mt-datetime-picker :startDate="startDate"</mt-datetime-picker>

data(){
 return{
  startDate: new Date(),
 }
}

设置默认值

this.zheng=new Date().getFullYear()+&#39;年&#39;+new Date().getMonth()+1+&#39;月&#39;+new Date().getDate()+&#39;日&#39;

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

How to modify the project name through the vue-cli webpack project

How to implement debugging and independent packaging through the webpack project Configuration file (detailed tutorial)

How to use vue webpack to solve the 404 blank page problem of packaged files

The above is the detailed content of Using the time plug-in and getting the selection value in mint-ui. For more information, please follow other related articles on the PHP Chinese website!