Nothing Precedes Matter

    vue-lunar-calendar

    1.7.0 • Public • Published

    npm npm npm

    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 Chinese Lunar Calendar
    • You can also use it as a solar(gregorian) calendar

    Online demo

    Install

    npm install vue-lunar-calendar --save

    or using Yarn

    yarn add vue-lunar-calendar

    Usage

    1. import your project
    import lunarCalendar from 'vue-lunar-calendar'
    1. Declare to component your project
    Vue.component('lunar-calendar', lunarCalendar)

    or

    new Vue({
      components: {'lunar-calendar': lunarCalendar}
      // or components: {lunarCalendar}
    })
    1. use in your project.
    <template>
      <lunar-calendar
        @change="onChange"
        :firstDayOfWeek="parseInt(firstDayOfWeek)"
        :disableDaysBeforeToday="disableDaysBeforeToday"
        :defaultDate="defaultDate"
        :showLunarButton="showLunarButton"
        :cellClass="$style.cell"
      ></lunar-calendar>
    </template>
     
    <style module>
      .cell {
        background-color: #222944;
      }
    </sryle>

    Props

    Property Desc Type Default values
    firstDayOfWeek Set the first day of Week Number 0 ( sunday )
    disableDaysBeforeToday Disable days before today or not Boolean -
    disabledFunc Use to decide if the day is disabled or not. Function null
    defaultDate Init the selected date String -
    showLunar Show or hide lunar Boolean false
    showLunarButton Show or hide lunar check button Boolean true
    lang Language String 'ko'
    dateLang Language of date String 'en'
    cellSeletedClass cell seleted css class String -
    customCells custom cells Array -

    Language

    Addr Language
    ko Korean
    en English
    it Italian
    cn Chinese
    vi Vietnamese
    fr French
    ja Japanese

    If you want to add to language, please check CONTRIBUTING.md

    Event

    Event Desc params
    change Emit when cell is clicked Function

    Run the project

    If you want to run this project

    npm run start

    or using Yarn

    yarn start

    open user browser

    http://0.0.0.0:8080/
    

    Build

    If you want to build this project

    # Build the project 
    npm run build
    # Build the demo 
    npm run demo

    or using Yarn

    # Build the project 
    yarn build
    # Build the demo 
    yarn demo

    Thanks for

    @ClaudeSeo

    Install

    npm i vue-lunar-calendar

    DownloadsWeekly Downloads

    41

    Version

    1.7.0

    License

    ISC

    Unpacked Size

    1.65 MB

    Total Files

    16

    Last publish

    Collaborators

    • kimwoohyun