1.0.8 • Published 10 months ago

react-month-picker-simple v1.0.8

Weekly downloads
-
License
-
Repository
github
Last release
10 months ago

react-month-picker-simple is simplest month picker component.

Installation

npm install react-month-picker-simple

PlayGround

https://ey920911.github.io/react-month-picker-simple/

Simple example

basic style

Example Code

import React, { CSSProperties } from 'react';
import MonthPicker from 'react-month-picker-simple';

export default function () {
    return (
        <div style={{width:'300px'}}>
            <MonthPicker handleChange={(date: Date)=> {}}/>
        </div>
    )
}

customize style

Example Code

import React, { CSSProperties } from 'react';
import MonthPicker from 'react-month-picker-simple';

const BaseStyle: CSSProperties ={
  backgroundColor: 'blue',
  border:'1px solid white',
  color:'white'
}

const SelectedStyle: CSSProperties ={
  backgroundColor: 'white',
  color:'black'
}

export default function () {
    return (
        <div style={{width:'300px'}}>
             <MonthPicker
                language="zh"
                buttonStyle={BaseButtonStyle}
                selectedButtonStyle={SelectedStyle}
                handleChange={(date: any) => {}}
            />
        </div>
    )
}

Props

All props list of react-month-picker-simple.

NameRequiredTypeDefaultDescription
handleChangetrue(date: Date) => void1The function to catch changed date
minYearfalsenumbercurrentYear - 20The value of minium year to select year
maxYearfalsefunctioncurrentYearThe value of maxium year to select year
languagefalse'en', 'ko', 'zh''en'The language info
customMonthfalsestring[]undefinedThe customed month info
buttonStylefalseCSSPropertiesundefinedThe button style not selected
selectedButtonStylefalseCSSPropertiesundefinedThe button style that selected