A calendar component for vue.js

Overview

vue-calendar

A calendar component for vue.js compitable with vue 2.x

examples

website: GilbertSun/vue-calendar

install & use

npm install vue-calendar-mobile

# for 1.x
npm install vue-calendar-mobile@1

use in a vue component

<template>
<calendar :view="'month'"></calendar>
</template>

<script>
import Calendar from 'vue-calendar-mobile'

export default {
  components: {
    Calendar
  }
}
</script>

Develope

you want to change the source and see what's you change

$ make dev

it will server a locale demo page in http://localhost:8080

then you change change the source code in src directory

refresh the demo page

$ make deploy

publish to npm

$ make pub

API

prop type description example default value
currentView Object cureent shown view {}, simple pass a clean object {start: Object, end: Object}
decorate Object control the date to have a dot docorate {'2016-08-09': true} {}
sub Object control the date sub decorate {'2016-08-09': {content: '休', color: '班'}}} {}
i18n String control week name language 'zh-cn', 'en' 'zh-cn'
indicator Object control the header indicator default the year and month {title: ..., main: ...} {}
selected Date current select date new Date(2016, 11, 6) new Date()
startMonday Boolean is the week start from monday, true for monday and false for sunday true false
startDate Date this start Date to control the first view to show startDate new Date(2016, 11, 6) new Date()
view String show to month view of week view 'month', 'week' 'month'
centerHeader Boolean control the calendar header position true false
You might also like...
A lightweight calendar component for Vue2

vue2-calendar Check out the demo here on Code Sandbox: Introduction This is a simple and small event calendar component for Vue js. It is very lightwe

vue calendar fullCalendar. no jquery required. Schedule events management
vue calendar fullCalendar. no jquery required. Schedule events management

##vue-fullcalendar Works for Vue2 now. This is a fullCalendar component based on vue.js . No Jquery or fullCalendar.js required. Currently, It only su

An elegant calendar and datepicker plugin for Vue.
An elegant calendar and datepicker plugin for Vue.

An elegant calendar and datepicker plugin for Vuejs. npm i --save v-calendar Documentation For full documentation, visit vcalendar.io. Attributes High

Vue.js wrapper for TOAST UI Calendar

Vue TOAST UI Calendar A Vue.js wrapper for TOAST UI Calendar Installation npm install --save tui-calendar @lkmadushan/vue-tuicalendar Usage Example Tr

Toast UI Calendar for Vue

TOAST UI Calendar for Vue This is Vue component wrapping TOAST UI Calendar. 🚩 Table of Contents Collect statistics on the use of open source Install

A Vue JS full calendar, no dependency, no BS. :metal:

vue-cal A Vue JS full calendar, no dependency, no BS. 🤘 Installation npm i vue-cal Vue 3 npm i vue-cal@next Demo & Documentation antoniandre.github

A full 12-Month view calendar made by vue.js.
A full 12-Month view calendar made by vue.js.

English | 繁體中文 There is no full year (12 months on a page) calendar right now, the Vue-material-year-calendar is designed to solve this problem. 🔥 12

Simple and clean calendar written in Vue.js
Simple and clean calendar written in Vue.js

Vuelendar Simple and clean calendar written in Vue.js. Check out full Vuelendar's documentation here. Features Select single date Select range of date

Full Calendar based on Vue.js

Vue Spring Calendar It's a Vue based component which provides the functionality of a full-calendar that shows daily events. Installation npm install v

Comments
  • More documentation needed

    More documentation needed

    For example

    • [x] screentshot,
    • [x] configuration,
    • [x] demo
    • [ ] further clarification, e.g. for mobile only?

    I think I need all these to judge my star :smile:

    opened by jizusun 6
  • startMonday

    startMonday

    Thank you for your component. When I used it ,I found a weird question that "startMonday" always is true even though I set default as false. But if I changed "startMon" or any word ,it would work successfully. I do not know why. qq 20170112230858 qq 20170112231324

    opened by xiaowoniu22 4
  • vue 2.0 报错?确定支持vue 2.0 吗?

    vue 2.0 报错?确定支持vue 2.0 吗?

    [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "selected" (found in component )

    opened by SidFeng 3
A vue component for lunar calendar.

vue-lunar-calendar A vue component for lunar calendar. Uses Moment.js for date operations. This is the Korean lunar calendar. It is different from Chi

Kim WooHyun 70 Aug 20, 2022
Simple Vue component to show a month-grid calendar with events

VueSimpleCalendar Introduction vue-simple-calendar is a flexible, themeable, lightweight calendar component for Vue that supports multi-day scheduled

Richard Tallent 762 Jan 3, 2023
A simple infinite calendar component in Vue 2

vue-infinite-calendar A simple infinite calendar component in Vue 2 Build Setup # install dependencies npm install # serve with hot reload at localho

Rares S 15 Feb 28, 2022
A calendar component for Vue.js

calendar Chinese This is a calendar component based on vue.js . support custom content. No dependencies. Currently, It only supports month view. You c

Kylin 47 Aug 16, 2022
vue 2.x calendar component

vue2-calendar vue 2 calendar, datepicker component which supported lunar or date event Live Demo >> This project is not only a vue component, but also

Terry Cai 485 Dec 18, 2022
Vue.js Functional Calendar | Component/Package

Vue Functional Calendar Modern calendar and datepicker module for Vue.js Demo Demo: https://y3jnxov469.codesandbox.io/ Lightweight, high-performance c

Manuk 425 Dec 27, 2022
📅 A feature-rich calendar component, support multiple modes and gesture sliding. For vue 3.0+

?? A calendar component for vue3.0. Support gesture sliding, range selection, according to the week switch...

飞翔的荷兰人 434 Jan 3, 2023
a horizontal calendar component for Vue.js

a horizontal calendar component for Vue.js

jacques 37 Aug 10, 2022
A simple vue calendar component. Base for further development and styling.

vue-simple-calendar A simple vue calendar component with minimal css. A base for further development/styling. DEMO Dependencies date-fns, lodash-es In

Roman Ranniew 6 Jun 15, 2022
Calendar component

vue-calendar-picker Calendar component vue-calendar-picker demo on jsfiddle Example - basic <template> <calendar></calendar> </template> <script>

Franck Freiburger 47 Nov 24, 2022