vue-datepicker
datepicker component for Vue.js, already support Vue.js 2.x, the Vue.js 1.x version is on branch
vue-1.x
(not maintain).
Live Demo is here
Installation
npm install vue-date --save
Usage
.vue
file:
use with single <template> <div> <datepicker v-model="date"></datepicker> </div> </template> <script> import datepicker from 'vue-date' export default { data() { return { date: '2016-10-16' } }, components: { datepicker } } </script>
use in browser:
//index.html <html> <script src="path/to/vue.js"></script> Â Â <script src="path/to/index.js"></script> <body> <div id="app"> <datepicker v-model="date"></datepicker> </div> <script> new Vue({ el: '#app', data: { date: '2016-10-16' }, components: { datepicker } }) </script> </body> </html>
Props
language
String
Type: en
Default: en(English)
, zh-cn(Chinese)
, uk(Ukrainsk)
, es(Spanish)
Optional: The language type. Support en
(English), zh-cn
(Chinese), uk
(Ukrainsk) and es
(Spanish) now.
min
String
Type: 1970-01-01
Default: The minimum date.
//pass string <datepicker v-model="start" min="2015-01-01"</datepicker> //or pass variable <datepicker v-model="start" :min="variable"></datepicker>
max
String
Type: 3016-01-01
Default: The maximum date. Usage is same of min
.
range
Boolean
Type: false
Default: Use range mode or not. If pass true
, the binding value should be an Array containg the range start and range end. eg. ['1970-01-01', '3016-01-01']
Licence
MIT