95 lines
2.7 KiB
Markdown
95 lines
2.7 KiB
Markdown
## @vuepic/vue-datepicker
|
|
|
|
|
|
### The most complete datepicker solution for Vue 3
|
|
|
|
[](https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE) [](https://www.npmjs.com/package/@vuepic/vue-datepicker)  [](https://github.com/Vuepic/vue-datepicker/issues)  
|
|
[](https://sonarcloud.io/summary/new_code?id=Vuepic_vue-datepicker)
|
|
|
|
|
|
|
|
|
|
[DOCUMENTATION](https://vue3datepicker.com/)
|
|
|
|
|
|
[StackBlitz Playground](https://stackblitz.com/edit/vuepic-vue-datepicker?file=src%2Fcomponents%2FPlayground.vue)
|
|
|
|
## Features
|
|
|
|
- Single date picker
|
|
- Range date picker
|
|
- Time picker
|
|
- Month picker
|
|
- Year picker
|
|
- Week picker
|
|
- Multiple dates select
|
|
- Multiple calendars
|
|
- Text input
|
|
- UTC support
|
|
- Timezones
|
|
- Locale support
|
|
- Week numbers
|
|
- Custom `v-model`
|
|
- Dark and light theme
|
|
- SSR support
|
|
- Highly configurable
|
|
- Accessible
|
|
- Included type definitions
|
|
|
|
## Install
|
|
|
|
```shell
|
|
yarn add @vuepic/vue-datepicker
|
|
|
|
# or
|
|
|
|
npm install @vuepic/vue-datepicker
|
|
```
|
|
|
|
Import and register component
|
|
|
|
**Global**
|
|
|
|
```js
|
|
import { createApp } from 'vue';
|
|
import App from './App.vue';
|
|
|
|
import Datepicker from '@vuepic/vue-datepicker';
|
|
import '@vuepic/vue-datepicker/dist/main.css';
|
|
|
|
const app = createApp(App);
|
|
app.component('Datepicker', Datepicker);
|
|
```
|
|
|
|
**Local**
|
|
|
|
```vue
|
|
<script>
|
|
import Datepicker from '@vuepic/vue-datepicker';
|
|
import '@vuepic/vue-datepicker/dist/main.css';
|
|
|
|
export default {
|
|
components: { Datepicker }
|
|
}
|
|
</script>
|
|
```
|
|
|
|
## Supporting the project
|
|
|
|
As you may know, maintaining an open-source project is a very time-consuming job. Your support is very appreciated ❤️
|
|
|
|
Please ⭐️ this repository if you like the component!
|
|
|
|
You can also make a financial contribution via sponsoring this project or one time donation. [Become a sponsor](https://github.com/sponsors/Vuepic)
|
|
|
|
Special thanks to our sponsors 🙏
|
|
|
|
<a href="https://hapio.io/" target="_blank">
|
|
<img src="https://avatars.githubusercontent.com/u/99868704?s=200&v=4" width="80" alt="Hapio">
|
|
</a>
|
|
|
|
## License
|
|
|
|
Copyright © 2021-present [Vuepic](https://github.com/Vuepic)
|
|
|
|
[MIT](https://github.com/Vuepic/vue-datepicker/blob/master/LICENSE)
|