JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1033
  • Score
    100M100P100Q98470F
  • License MIT

datepicker component for Vue.js

Package Exports

  • vue-date

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-date) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

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

use with single .vue file:

<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

Type: String
Default: en
Optional: en(English), zh-cn(Chinese), uk(Ukrainsk), es(Spanish)

The language type. Support en(English), zh-cn(Chinese), uk(Ukrainsk) and es(Spanish) now.

min

Type: String
Default: 1970-01-01

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

Type: String
Default: 3016-01-01

The maximum date. Usage is same of min.

range

Type: Boolean
Default: false

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