https://github.com/gentieman/v-month-picker

Simple year and month picker inspired by vuetify's monthpicker.
https://github.com/gentieman/v-month-picker

month-picker vue vuejs

Last synced: 2 months ago
JSON representation

Simple year and month picker inspired by vuetify's monthpicker.

• Host: GitHub
• URL: https://github.com/gentieman/v-month-picker
• Owner: GentIeman
• License: mit
• Created: 2021-12-05T19:43:39.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2022-03-21T21:22:23.000Z (about 3 years ago)
• Last Synced: 2025-03-18T15:48:46.801Z (3 months ago)
• Topics: month-picker, vue, vuejs
• Language: Vue
• Homepage: https://github.com/GentIeman/v-month-picker#readme
• Size: 832 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# v-month-picker

[![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE)

[![Latest Version on NPM](https://img.shields.io/npm/v/v-month-picker.svg?style=flat-square)](https://www.npmjs.com/package/v-month-picker)

[![npm](https://img.shields.io/npm/dt/v-month-picker.svg?style=flat-square)](https://www.npmjs.com/package/v-month-picker)

[![Vue 2.x](https://img.shields.io/badge/vue-2.x-brightgreen.svg?style=flat-square)](https://vuejs.org)

## Description

Simple year and month picker inspired by vuetify's monthpicker. 


Vue component compatible with Vue 2.x

- [Demo](#demo)

- [Install](#install)

- [Usage](#usage)

- [Props](#available-props)

- [Dependencies](#dependencies)

- [License](#license)

## Demo

To view a demo online: [CodeSandBox](https://codesandbox.io/s/cranky-https-wi3iy?file=/src/App.vue) 


To view demo examples locally clone the repo and run ``npm install && npm run serve``

## Install

Use npm: ```npm i v-month-picker  --save```

## Add to project

### global

```js

// main.js

import MonthPicker from "v-month-picker";

Vue.component('MonthPicker', MonthPicker);

```

### locale

``` javascript

import MonthPicker from 'v-month-picker';

export default {

  components: {

    MonthPicker

  }

  // your code...

}

```

## Usage

Below code in the ``````:


```html 

```

## Available props

| Prop               | Type     | Default | Description                         |

|--------------------|----------|---------|-------------------------------------|

| v-model (required) | `String` |         | Date in ISO format                  |

| horizontal-align   | `String` | bottom  | Horizontal positioning of the popup |

| vertical-align     | `String` | center  | Vertical positioning of the popup   |

| locale             | `String` | ru      | Translation for months              |

| first-year         | `String` | 1950    | Start year                          |

| last-year          | `String` | 2049    | End year                            |

## Dependencies

- [v-click-outside](https://www.npmjs.com/package/v-click-outside)

- [vue](https://www.npmjs.com/package/vue)

## License

MIT

This is my first npm package, please don't hit me ;)