日期选择(vDatepicker)

单组件引入

import <name> from ‘vucc/datepicker’;

示例






代码 V

<v-datepicker v-model="time1" :disable-filter="disableFilter" :is-force-refresh="true"></v-datepicker>
<v-datepicker :is-range="true" :disable-filter="disableFilter" :range-data="rangeData" :format="'YYYY/MM/DD hh:mm:ss'"></v-datepicker>


data() {
    return {
        rangeData: {
            endTime: '2016-10-30',
            startTime: '2016-09-27',
        },
        time1: '',
        time: '2015/12/12'
    }
},
methods: {
    disableFilter(date) {
        if(this.xx) {
            return date.getDay() === 0 || date.getDay() === 6;
        } else {
            return false;
        }
    }
},



属性

参数 说明 类型 可选值 默认值
time 传入的日期,当isRange为false时使用 Number - Date.now()
rangeData 传入日期范围,包括startTime和endTime,ex: {startTime: Data.now(), endTime: Data.now()} Object - -
isRange 是否是范围类型的日期选择器 Boolean - false
format 日期的输出格式,现在支持 “YYYY(-)MM(-)DD” / “”YYYY(-)MM(-)DD hh:mm:ss” 连接符号可以自选 String - YYYY-MM-DD
hasFooter 是否有确定,取消两个按钮,当isRange和有时分秒的情况下不起作用 Boolean - false
isForceRefresh 是否强制刷新,为true时,每次都调用禁用过滤器,性能会有些许降低 Boolean - false
isDisabled 日期选择器是否禁用 Boolean - false

方法

名称 说明 类型 可选值 默认值
onOk 确定按钮回调 Function - -
onCancel 取消按钮回调 Function - -
onSuccess 选中按钮回调 Function - -
disableFilter 禁用过滤器,返回true时将禁用改天的选择, 只有在初始化时调用,当isForceRefresh为true时,每次都会调用过滤器 Function - -
onOpen 当日期选择器打开时触发，传入mouseEvent Function - -
← 搜索框(vSearch)