https://github.com/azurewarth0920/vue3-range-calendar

Calendar UI component library of Vue.js 3 for picking date, week, month, year ranges, with zero dependencies and high customizability.
https://github.com/azurewarth0920/vue3-range-calendar

calendar range rangepicker vue vue3

Last synced: 11 days ago
JSON representation

Calendar UI component library of Vue.js 3 for picking date, week, month, year ranges, with zero dependencies and high customizability.

• Host: GitHub
• URL: https://github.com/azurewarth0920/vue3-range-calendar
• Owner: Azurewarth0920
• License: mit
• Created: 2021-05-27T12:20:09.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-07-24T15:06:22.000Z (4 months ago)
• Last Synced: 2024-10-17T19:57:51.884Z (21 days ago)
• Topics: calendar, range, rangepicker, vue, vue3
• Language: TypeScript
• Homepage:
• Size: 292 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue3-range-calendar

## Overview

Vue3-range-calendar is a calendar UI component library for picking date, week, month, year ranges, with zero dependencies and high customizability for Vue3.

## Installation

### npm

```shell

yarn add vue3-range-calendar

# or

npm install vue3-range-calendar

```

Install component to the Vue instance.

```JavaScript

import { createApp } from 'vue'

import rangeCalendar from 'vue3-range-calendar'

import 'vue3-range-calendar/dist/styles/index.css'

const app = Vue.createApp({...})

app.use(rangeCalendar)

```

Then you can use the range calendar on your component.

eg.

```Vue

const start = ref<Date | null>(null)

const end = ref<Date | null>(null)

  
start: 

  
end: 

  


```

## Documentation

To check out [examples](https://vue3-range-calendar.azurewarth0920.com/example.html) and [options](https://vue3-range-calendar.azurewarth0920.com/options.html), visit [here](https://vue3-range-calendar.azurewarth0920.com/).