mint-ui 時間插件使用及獲取選擇值的方法
更新時間：2018年02月09日 10:56:37 作者：Thekingyu
下面小編就為大家分享一篇mint-ui 時間插件使用及獲取選擇值的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
如下所示：
<div > {{pickerValue}}</div>
<mt-datetime-picker
ref="picker" 每一個都要填上這一條open
type="time"
@confirm="handleConfirm" 設(shè)置點擊確定
v-model="pickerValue">
</mt-datetime-picker>
data () {
return {
pickerValue:null, 定義
methods:{
openPicker() {
this.$refs.picker.open();設(shè)置開始
},
handleConfirm(){ console.log(this.pickerValue) ;獲取值},
轉(zhuǎn)換小時
formatDate(date) {
const y = date.getFullYear()
let m = date.getMonth() + 1
m = m < 10 ? '0' + m : m
let d = date.getDate()
d = d < 10 ? ('0' + d) : d
return y + ' ' + m + ' ' + 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) ;
},
設(shè)置當(dāng)前日期為初始日期
<mt-datetime-picker :startDate="startDate"</mt-datetime-picker>
data(){
return{
startDate: new Date(),
}
}
設(shè)置默認值
this.zheng=new Date().getFullYear()+'年'+new Date().getMonth()+1+'月'+new Date().getDate()+'日'
以上這篇mint-ui 時間插件使用及獲取選擇值的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細介紹了vue實現(xiàn)放大縮小拖拽功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-05-05
這篇文章主要介紹了Vue解決跨域問題常見方法,結(jié)合實例形式詳細分析了vue出現(xiàn)跨域問題的原因,以及常見解決方案與相關(guān)注意事項,需要的朋友可以參考下2023-06-06
Vue.js 是一個流行的前端框架,旨在通過其響應(yīng)式的數(shù)據(jù)綁定和組件化的開發(fā)模式簡化開發(fā),然而,在開發(fā) Vue.js 應(yīng)用時,頁面反復(fù)刷新的問題可能會對用戶體驗和開發(fā)效率產(chǎn)生負面影響,本文將深入探討 Vue 頁面反復(fù)刷新的常見原因,并提供詳細的解決方案2024-09-09
這篇文章主要為大家介紹了Vue watch偵聽器，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
這篇文章主要介紹了 解決Vue打包后訪問圖片/圖標(biāo)不顯示的問題，本文給大家介紹的非常詳細，具有一定的參考解決價值,需要的朋友可以參考下2019-07-07
Vue/React子組件實例暴露方法(TypeScript)
最近幾個月都在用TS開發(fā)各種項目，框架有涉及到Vue3,React18等，記錄一下Vue/React組件暴露出變量/函數(shù)的方法的寫法，對vue?react組件暴露方法相關(guān)知識感興趣的朋友跟隨小編一起看看吧2022-11-11
vue動態(tài)路由實現(xiàn)多級嵌套面包屑的思路與方法
在實際項目中我們會碰到多層嵌套的組件組合而成，比如我們常見的面包屑導(dǎo)航，下面這篇文章就來給大家介紹關(guān)于vue實現(xiàn)動態(tài)路由多級嵌套面包屑的思路與方法，文中通過示例代碼介紹的非常詳細，需要的朋友可以參考借鑒，下面來一起看看吧。2017-08-08
這篇文章主要給大家介紹了關(guān)于VUE登錄注冊頁面的相關(guān)資料,在Vue中可以使用組件來構(gòu)建登錄注冊頁面,文中通過圖文以及代碼介紹的非常詳細,需要的朋友可以參考下2023-12-12
vue和better-scroll實現(xiàn)列表左右聯(lián)動效果詳解
這篇文章主要介紹了vue和better-scroll實現(xiàn)列表左右聯(lián)動效果，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
vuejs2.0實現(xiàn)分頁組件使用$emit進行事件監(jiān)聽數(shù)據(jù)傳遞的方法
這篇文章主要介紹了vuejs2.0實現(xiàn)分頁組件使用$emit進行事件監(jiān)聽數(shù)據(jù)傳遞的方法，非常不錯，具有參考借鑒價值，,需要的朋友可以參考下2017-02-02