A react native module to show calendar, it works on iOS and Android.

Content

Installation

  • 1.Run npm install react-native-whc-calendar --save
  • 2.import Calendar from 'react-native-whc-calendar'

Demo

  • Example

Getting started

Add react-native-whc-calendar to your js file.

import Calendar from 'react-native-whc-calendar'

Inside your component’s render method, use Calendar:

 render() {
         return (
             <Calendar
                 days={30}
             />
         );
 }
Copy the code

Basic usage

Render () {return (<Calendar days={30} onSelectedDateBlock={(s,e) => {/// return selected date}}/>); }Copy the code

API

Props Type Optional Default Description
days PropTypes.number true 0 Specified date days
months PropTypes.number true 0 Specified date months
startYear PropTypes.number true 0 Specified date start year
endYear PropTypes.number true 0 Specified date end year
startDateStr PropTypes.string true null default choice start date
endDateStr PropTypes.string true null default choice end date
startSelectedHint PropTypes.string true null default choice start date hint
endSelectedHint PropTypes.string true null default choice end date hint
onSelectedDateBlock PropTypes.func true null choice date callback func
selectedColor PropTypes.string true null default choice date back color
selectedMidColor PropTypes.string true null default choice min date back color
selectedTextColor PropTypes.string true null default choice date text color
highlightColor PropTypes.string true null default date holiday color
enableSingleChoice PropTypes.bool true false enable single one date
invalidDateNotSelected PropTypes.bool true true default not choice invalid date

Contribution

Issues are welcome. Please add a screenshot of bug and code snippet. Quickest way to solve issue is to reproduce it on one of the examples.

Pull requests are welcome. If you want to change API or making something big better to create issue and discuss it first.


MIT Licensed