vue-multi-date-picker

A date picker for vue2.x support multi selection

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
vue-multi-date-picker
501.5.04 years ago5 years agoMinified + gzip package size for vue-multi-date-picker in KB

Readme

vue-multi-date-picker

Demo

A date picker for vue2.x support multi selection

Build Setup

``` bash
clone
git clone git@github.com:zhaokuohaha/vue-multi-date-picker.git cd vue-multi-date-picker
install dependencies
npm install
serve with hot reload at localhost:8080
npm run dev
build for production with minification
npm run build ```

Property

|property|type|defaults|comment| |---|---|---|---| |model|Array (multi = true) , Date (multi = false)|- |the model of date picker| |multi| Boolean| true |use multi select | |disp| Array|'日', '一', '二', '三', '四', '五', '六','年', '月', '取消', '确定'| Customize display text. The order of array must strict | |lang| String | 'zh' | Set to 'en' to translate to english | |format| Function | function (date) { return date.toLocaleDateString(); } | Accepts a function with a date argument and returns a string | |always-display| Boolean | false | Always display the date picker |

Usage

Notice: selected dates are UTC formatted

Manually

  1. Copy /src/lib/multiDatePicker.vue to your project
  1. Use as component
```html
<m-date-picker v-model="date" :multi="multi" :always-display="false" :format="formatDate"></m-date-picker>
```

npm

  1. Install
```shell npm install -S vue-multi-date-picker ```
  1. Use plugin
```js // main.js import mDatePicker from 'vue-multi-date-picker' // ... Vue.use(mDatePicker) ``` ```html
<m-date-picker v-model="date" :multi="multi" :always-display="false" :format="formatDate"></m-date-picker>
``` For detailed explanation on how things work, consult the docs for vue-loader.