You can select or input a date, month, year, time or datetime
+
+
+
ValueType
+
You can set the type of the v-model value by valueType.
+
+
"format": return a string same as the input value.
+
"date"(default): return a Date Object.
+
"timestamp": return a Number.
+
token: a accepted format string pattern.
+
+
+
+
Range
+
Support to select a date range.
+
+
+
DisabledDate & DisabledTime
+
Disabled part of dates and time by disabledDate and disabledTime respectively.
+
You should let the defaultValue not be disabled, when you use disabledDate or disabledTime.
+
+
+
Disabled & editable
+
+
disabled: A disabled state of the DatePicker
+
editable: Whether to allow manual input
+
+
+
+
Shortcut
+
You can set shortcuts to improve user experience.
+
Use the header slot or the footer slot to render extra element in panel for customized requirements.
+
+
+
Control TimePanel visible(datetime mode)
+
The display or hiding of the time panel can be controlled by showTimePanel.
+
The time panel is displayed after the date is selected by default.
+
+
+
Control Open
+
You can use the prop open to control the visible of popup.
+
This example shows how to close the popup when the seconds is selected.
+
+
+
Hide seconds selection & display AMPM selection
+
The columns of the time Picker is displayed according to the value of format(HH:mm:ss) by default.
+
You can also set showHourshowMinuteshowSecond to override the default value
+
+
+
Interval and custom time options
+
Set stepped time options by hourStepminuteStepsecondStep
+
Set custom time options by hourOptionsminuteOptionssecondOptions.
+
+
+
Select fixed time list
+
You can provide a list of fixed time for users to choose by timePickerOptions
diff --git a/example.9bb69ced.js b/example.9bb69ced.js
new file mode 100644
index 0000000..07e07db
--- /dev/null
+++ b/example.9bb69ced.js
@@ -0,0 +1,2805 @@
+// modules are defined as an array
+// [ module function, map of requires ]
+//
+// map of requires is short require name -> numeric require
+//
+// anything defined in a previous bundle is accessed via the
+// orig method which is the require for previous bundles
+parcelRequire = (function (modules, cache, entry, globalName) {
+ // Save the require from previous bundle to this closure if any
+ var previousRequire = typeof parcelRequire === 'function' && parcelRequire;
+ var nodeRequire = typeof require === 'function' && require;
+
+ function newRequire(name, jumped) {
+ if (!cache[name]) {
+ if (!modules[name]) {
+ // if we cannot find the module within our internal map or
+ // cache jump to the current global require ie. the last bundle
+ // that was added to the page.
+ var currentRequire = typeof parcelRequire === 'function' && parcelRequire;
+ if (!jumped && currentRequire) {
+ return currentRequire(name, true);
+ }
+
+ // If there are other bundles on this page the require from the
+ // previous one is saved to 'previousRequire'. Repeat this as
+ // many times as there are bundles until the module is found or
+ // we exhaust the require chain.
+ if (previousRequire) {
+ return previousRequire(name, true);
+ }
+
+ // Try the node require function if it exists.
+ if (nodeRequire && typeof name === 'string') {
+ return nodeRequire(name);
+ }
+
+ var err = new Error('Cannot find module \'' + name + '\'');
+ err.code = 'MODULE_NOT_FOUND';
+ throw err;
+ }
+
+ localRequire.resolve = resolve;
+ localRequire.cache = {};
+
+ var module = cache[name] = new newRequire.Module(name);
+
+ modules[name][0].call(module.exports, localRequire, module, module.exports, this);
+ }
+
+ return cache[name].exports;
+
+ function localRequire(x){
+ return newRequire(localRequire.resolve(x));
+ }
+
+ function resolve(x){
+ return modules[name][1][x] || x;
+ }
+ }
+
+ function Module(moduleName) {
+ this.id = moduleName;
+ this.bundle = newRequire;
+ this.exports = {};
+ }
+
+ newRequire.isParcelRequire = true;
+ newRequire.Module = Module;
+ newRequire.modules = modules;
+ newRequire.cache = cache;
+ newRequire.parent = previousRequire;
+ newRequire.register = function (id, exports) {
+ modules[id] = [function (require, module) {
+ module.exports = exports;
+ }, {}];
+ };
+
+ var error;
+ for (var i = 0; i < entry.length; i++) {
+ try {
+ newRequire(entry[i]);
+ } catch (e) {
+ // Save first error but execute all entries
+ if (!error) {
+ error = e;
+ }
+ }
+ }
+
+ if (entry.length) {
+ // Expose entry point to Node, AMD or browser globals
+ // Based on https://github.com/ForbesLindesay/umd/blob/master/template.js
+ var mainExports = newRequire(entry[entry.length - 1]);
+
+ // CommonJS
+ if (typeof exports === "object" && typeof module !== "undefined") {
+ module.exports = mainExports;
+
+ // RequireJS
+ } else if (typeof define === "function" && define.amd) {
+ define(function () {
+ return mainExports;
+ });
+
+ // \n"
+}, {
+ id: 'ValueType',
+ component: _ValueType.default,
+ code: "\n