vue-datetime是一个基于Vue的日期时间选择器，适用于移动设备。它支持日期、日期时间和时间模式，i18n和禁用日期等功能。
使用方法
安装
如果您想使用vue-datetime，首先您需要安装它，命令如下：
npm install --save luxon vue-datetime weekstart // 或者使用yarn yarn add luxon vue-datetime weekstart
注意：luxon请使用1.25.0版本，否则可能会出现问题。另外，weekstart是可选的它用于获取一周的第一天是哪一天。
使用
注册
import Vue from 'vue'
import { Datetime } from 'vue-datetime'
// You need a specific loader for CSS files
import 'vue-datetime/dist/vue-datetime.css'
Vue.use(Datetime)
或者
import { Datetime } from 'vue-datetime';
Vue.component('datetime', Datetime);
也可以局部注册使用
import { Datetime } from 'vue-datetime';
Vue.extend({
template: '...',
components: {
datetime: Datetime
}
});
然后可以在vue组件中使用：
在浏览器页面中，通过下面的方法引入
<link rel="stylesheet" href="vue-datetime.css"></link> <script src="vue.js"></script> <script src="luxon.js"></script> <script src="weekstart.js"></script> <script src="vue-datetime.js"></script>
此时，组件会自动被注册为<datetime>，如果你想用其它不同的名字，可以使用下面的方法：
Vue.component('vue-datetime', window.VueDatetime.Datetime);
配置参数
下面是vue-datetime的配置参数，你可以在<datetime>标签中设置它们来自定义选择器的行为和外观。
- type: 选择器的模式，可以是date、datetime或time，默认是datetime
- format: 选择器的格式，可以是任何有效的Luxon格式字符串，默认是"yyyy-MM-dd HH:mm"
- zone: 选择器的时区，可以是任何有效的IANA时区字符串，默认是本地时区
- min-datetime: 选择器的最小可选日期时间，可以是一个Date对象或一个ISO字符串，默认是null
- max-datetime: 选择器的最大可选日期时间，可以是一个Date对象或一个ISO字符串，默认是null
- disabled-weekdays: 选择器的禁用星期，可以是一个包含0到6之间数字的数组，表示星期日到星期六，默认是空数组
- auto: 选择器是否自动关闭，默认是true
- input-class: 选择器的输入框样式类，默认是空字符串
- wrapper-class: 选择器的包裹元素样式类，默认是空字符串
- step: 选择器的时间步长，以分钟为单位，默认是1
- use12-hour: 选择器是否使用12小时制，默认是false
- input-id: 选择器的输入框id，默认是空字符串
- input-style: 选择器的输入框样式，默认是空对象
- hidden-name: 选择器的隐藏输入框name，默认是空字符串
- value-zone: 选择器的值时区，默认是本地时区
- phrases: 选择器的自定义短语对象，默认是空对象
- hour-step: 选择器的小时步长，以小时为单位，默认是1
- minute-step: 选择器的分钟步长，以分钟为单位，默认是1
- week-start: 选择器的星期开始日，可以是0到6之间的数字，表示星期日到星期六，默认是0
- flow: 选择器的流程控制函数，默认是null
- title: 选择器的标题文本，默认是"Select Date"
- hide-backdrop: 是否隐藏背景遮罩层，默认是false
- backdrop-click: 是否允许点击背景遮罩层关闭选择器，默认是true
