quasar
Version:
Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
173 lines (158 loc) • 4.57 kB
JSON
{
"mixins": [ "components/date/use-datetime" ],
"meta": {
"docsUrl": "https://v2.quasar.dev/vue-components/time"
},
"props": {
"model-value": {
"extends": "model-value",
"type": [ "String", "null", "undefined" ],
"desc": "Time of the component; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive",
"examples": [
"v-model=\"currentTime\""
]
},
"format24h": {
"type": "Boolean",
"desc": "Forces 24 hour time display instead of AM/PM system",
"default": "(based on Quasar lang language being used)",
"category": "behavior"
},
"default-date": {
"type": "String",
"desc": "The default date to use (in YYYY/MM/DD format) when model is unfilled (undefined or null)",
"default": "current day",
"examples": [
"1995/02/23"
],
"category": "model"
},
"mask": {
"default": "HH:mm",
"examples": [ "HH:mm:ss", "YYYY-MM-DD HH:mm:ss", "HH:mm MMMM Do, YYYY" ]
},
"options": {
"type": "Function",
"desc": "Optionally configure what time is the user allowed to set; Overridden by 'hour-options', 'minute-options' and 'second-options' if those are set; For best performance, reference it from your scope and do not define it inline",
"params": {
"hr": {
"type": "Number",
"desc": "Hour"
},
"min": {
"type": [ "Number", "null" ],
"desc": "Minutes"
},
"sec": {
"type": [ "Number", "null" ],
"desc": "Seconds"
}
},
"returns": null,
"examples": [
":options=\"(hr, min, sec) => hr <= 6\""
],
"category": "behavior"
},
"hour-options": {
"type": "Array",
"desc": "Optionally configure what hours is the user allowed to set; Overrides 'options' prop if that is also set",
"examples": [
":hour-options=\"[ 3, 6, 9 ]\""
],
"category": "behavior"
},
"minute-options": {
"type": "Array",
"desc": "Optionally configure what minutes is the user allowed to set; Overrides 'options' prop if that is also set",
"examples": [
":minute-options=\"[0, 15, 30, 45]\""
],
"category": "behavior"
},
"second-options": {
"type": "Array",
"desc": "Optionally configure what seconds is the user allowed to set; Overrides 'options' prop if that is also set",
"examples": [
":second-options=\"[0, 7, 10, 23]\""
],
"category": "behavior"
},
"with-seconds": {
"type": "Boolean",
"desc": "Allow the time to be set with seconds",
"category": "model|behavior"
},
"now-btn": {
"type": "Boolean",
"desc": "Display a button that selects the current time",
"category": "content"
}
},
"slots": {
"default": {
"desc": "This is where additional buttons can go"
}
},
"events": {
"update:model-value": {
"extends": "update:model-value",
"params": {
"value": {
"type": [ "String", "null" ]
},
"details": {
"type": "Object",
"desc": "Object of properties on the new model",
"definition": {
"year": {
"type": "Number",
"required": true,
"desc": "The year"
},
"month": {
"type": "Number",
"required": true,
"desc": "The month"
},
"day": {
"type": "Number",
"required": true,
"desc": "The day of the month"
},
"hour": {
"type": "Number",
"required": true,
"desc": "The hour"
},
"minute": {
"type": "Number",
"required": true,
"desc": "The minute"
},
"second": {
"type": "Number",
"required": true,
"desc": "The second"
},
"millisecond": {
"type": "Number",
"required": true,
"desc": "The millisecond"
},
"changed": {
"type": "Boolean",
"required": true,
"desc": "Did the model change?"
}
}
}
}
}
},
"methods": {
"setNow": {
"desc": "Change model to current moment"
}
}
}