Maison >interface Web >js tutoriel >Utiliser le plug-in time et obtenir la valeur de sélection dans mint-ui

Utiliser le plug-in time et obtenir la valeur de sélection dans mint-ui

亚连
亚连original
2018-06-06 15:13:102170parcourir

Ci-dessous, je vais partager avec vous un article sur la façon d'utiliser le plug-in mint-ui time et d'obtenir la valeur de sélection. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

est le suivant :

<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;

Ce qui précède est ce que j'ai compilé pour vous, j'espère qu'il vous sera utile dans le. avenir.

Articles associés :

Comment modifier le nom du projet via le projet vue-cli+webpack

Comment obtenir le débogage et l'indépendance via le fichier de configuration d'empaquetage du projet webpack (tutoriel détaillé)

Comment utiliser vue+webpack pour résoudre le problème des 404 pages blanches des fichiers d'empaquetage

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn