Vue.js 2的简单日期和日期范围选择器 - v2-datepicker

Vue.js 2的简单日期和日期范围选择器 - v2-datepicker
插件名称 v2-datepicker
发布时间 2020年10月6日
插件作者 dwqs

Vue 2.x应用程序的一个简单但可配置的日期选择器和日期范围选择器组件。

安装和下载:

# Yarn
$ yarn add v2-datepicker

# NPM
$ npm install v2-datepicker --save

1. As the date-picker component/作为日期选择组件

Default usage/默认形式
//Return a string, which is the selected date.
<template>
    <v2-datepicker v-model='selected'></v2-datepicker>
</template>
Setting shortcuts/设置快捷项
//Return a string, which is the selected date.
<template>
    <v2-datepicker v-model='selected' :picker-options="options"></v2-datepicker>
</template>
options: {
    disabledDate (time) {
        return time.getTime() > Date.now();
    },
    shortcuts: [{
        text: 'Today',
        onClick (picker) {
            picker.$emit('pick', new Date());
        }
    }, {
        text: 'Yesterday',
        onClick (picker) {
            const date = new Date();
            date.setTime(date.getTime() - 3600 * 1000 * 24);
            picker.$emit('pick', date);
        }
    }, {
        text: 'A week ago',
        onClick (picker) {
            const date = new Date();
            date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
            picker.$emit('pick', date);
        }
    }]
}