1

2

3

4

安装

引入日期时间选择器

使用

<template>
  <div style="margin-left: 30px">
    <date-picker
        mode="datetime"
        :default-time="1566270847000"
        :min-time="1562037247000"
        :max-time="1567394047000"
        @change="getTime"></date-picker>
    <date-picker
        mode="date"
        format="YYYY年MM月DD日"
        :min-time="1562037247000"
        :max-time="1567394047000"
        @change="getTime"></date-picker>
    <date-picker
        mode="month"
        :min-time="1496128969000"
        :max-time="1590823369000"
        @change="getTime"></date-picker>
    <date-picker mode="year" @change="getTime"></date-picker>
  </div>
</template>

<script>
  import datePicker from './components/datePicker.vue'
  export default {
    name: '',
    components: {
      datePicker
    },
    data() {
      return {}
    },
    methods: {
      getTime(date){
        console.log(date);
      }
    }
  }
</script>


<style scoped>

</style>

属性

属性描述类型备注
mode日期类型Number(时间戳)没有默认值,必填,可选值为(date/datetime/month/year)
placeholderText没有选择日期时的占位文字String请选择日期/月份/年份
defaultTime默认时间Number(时间戳)没有默认值,选填
minTime最小可选时间Number(时间戳)没有默认值,选填
maxTime最大可选时间Number(时间戳)没有默认值,选填
format格式化显示日期StringYYYY-MM-DD hh:mm:ss
pickerWidth组件宽Number250/155