Element-ui?DatePicker日期選擇器基礎(chǔ)用法示例
更新時間:2023年06月29日 09:46:27 作者:菜園前端
這篇文章主要為大家介紹了Element-ui?DatePicker日期選擇器基礎(chǔ)用法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
Element-ui DatePicker
通常用于選擇日期
按需引入方式
如果是完整引入可跳過此步驟
import Vue from 'vue'
import { DatePicker } from 'element-ui'
import 'element-ui/lib/theme-chalk/base.css'
import 'element-ui/lib/theme-chalk/date-picker.css'
Vue.use(DatePicker)基礎(chǔ)用法
<template>
<el-date-picker v-model="value" type="date" placeholder="選擇日期"> </el-date-picker>
</template>
<script>
export default {
data() {
return {
value: ''
}
}
}
</script>選擇月份
<template>
<el-date-picker v-model="value" type="month" placeholder="選擇月份"> </el-date-picker>
</template>
<script>
export default {
data() {
return {
value: ''
}
}
}
</script>選擇年份
<template>
<el-date-picker v-model="value" type="daterange" range-separator="至" start-placeholder="開始日期" end-placeholder="結(jié)束日期"> </el-date-picker>
</template>
<script>
export default {
data() {
return {
value: []
}
}
}
</script>Attributes

以上就是Element-ui DatePicker日期選擇器基礎(chǔ)用法示例的詳細內(nèi)容,更多關(guān)于Element-ui DatePicker的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
vue3使用自定義指令實現(xiàn)el dialog拖拽功能示例詳解
這篇文章主要為大家介紹了vue3使用自定義指令實現(xiàn)el dialog拖拽功能示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-09-09
Vue中以HTML形式顯示內(nèi)容并動態(tài)生成HTML代碼的方法
有的時候我們想在vue中直接顯示一個html的網(wǎng)頁,如果用富文本方式,那么內(nèi)容就會太多,那么怎么處理呢?這篇文章主要給大家介紹了關(guān)于Vue中如何以HTML形式顯示內(nèi)容并動態(tài)生成HTML代碼的相關(guān)資料,需要的朋友可以參考下2024-03-03
vue 解決provide和inject響應(yīng)的問題
這篇文章主要介紹了vue 解決provide和inject響應(yīng)的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11

