react-native-calendar-component
v0.1.2
Published
Calendar component for ReactNative.
Downloads
5
Readme
react-native-calendar
Calendar component for ReactNative. It is stateless component.
install
npm install --save react-native-calendar-component
props
| prop | type | default value | |--------------------|----------|------------------------------| | date | Date | new Date() | | onDateSelect | function | null | | onPrevButtonPress | function | null | | onNextButtonPress | function | null | | dayNames | array | ["Sun", "Mon" ... ] | | monthNames | array | ["January", "February" ... ] | | weekFirstDay | number | 0 |
usage
import React, { Component } from "react";
import Calendar from "react-native-calendar-component";
export default class CalendarTest extends Component {
constructor(props) {
super(props);
this.state = {
date: new Date()
};
}
handleNextButtonPress() {
const date = new Date(this.state.date);
date.setMonth(date.getMonth() + 1);
this.setState({
date
});
}
handlePrevButtonPress() {
const date = new Date(this.state.date);
date.setMonth(date.getMonth() - 1);
this.setState({
date
});
}
handleDateSelect(date) {
alert(`clicked: ${this.state.date.toString()}`);
}
render() {
return (
<Calendar
date={this.state.date}
onPrevButtonPress={() => this.handlePrevButtonPress()}
onNextButtonPress={() => this.handleNextButtonPress()}
onDateSelect={(date) => this.handleDateSelect(date)} />
);
}
}